This is a basic guide for deploying a LoopBack 4 (LB4) app toIBM Cloud. In the setup explained below, your app willuse a provisionedCloudant service when runningon the IBM Cloud.

NOTE: Production deployment to IBM Cloud is a much bigger topic with manypossible options, refer to“IBM Cloud Continuous Delivery: Build, deploy, and manage apps with toolchains”for the details.

Before we begin

Make sure you have:

Preparing your application

We will be using the“todo” examplefrom the loopback-next repositoryas a basis for the instruction.

You can quickly clone the “todo” example app by running the command:

  1. lb4 example todo

Then you can replace the default memory-based connector of the app with aCloudant connector, so data is persisted.

Step 1: Provisioning a Cloudant database service

  • Go to theIBM Cloud Catalog, selectCloudant under All Categories > Databases.
  • Name your Cloudant service name as myCloudant. Keep the defaults for regionand resource group. Select “Use both legacy credentials and IAM” as theavailable authentication methods

myCloudant service name

  • Click Create.

Step 2: Creating a database named todo.

  • Go to your IBM Cloud dashboard.
  • Click on myCloudant under Services.

  • Click Launch Cloudant Dashboard.launch cloudant dashboard

  • In the Cloudant dashboard, click Create Database at the top of the page andname it as todo.

create database

Step 3: Updating your DataSource

Update db.datasource.json to use the Cloudant connector. The value for theurl property is just a placeholder and does not need to have the correctcredential because we will be binding the app with the Cloudant service onceit’s pushed to IBM Cloud.

  1. {
  2.   "name": "db",
  3.   "connector": "cloudant",
  4.   "url": "http://admin:pass@localhost:8080",
  5.   "database": "todo",
  6.   "modelIndex": ""
  7. }

Install the loopback-connector-cloudant package.

  1. $ npm i loopback-connector-cloudant

Step 4: Updating the application

  • We will use the cfenv module to simplify some of the Cloud Foundry relatedoperations. Install cfenv in the project directory.
  1. $ npm i cfenv
  • Update the src/index.ts file to the following to enable service binding.Add the 3 snippets as indicated below:
  1. import {TodoListApplication} from './application';
  2. import {ApplicationConfig} from '@loopback/core';
  3. // --------- ADD THIS SNIPPET ---------
  4. const datasourceDb = require('./datasources/db.datasource.json');
  5. const cfenv = require('cfenv');
  6. const appEnv = cfenv.getAppEnv();
  7. // --------- ADD THIS SNIPPET ---------
  9. export async function main(options?: ApplicationConfig) {
  10.   // --------- ADD THIS SNIPPET ---------
  11.   // Set the port assined for the app
  12.   if (!options) options = {};
  13.   if (!options.rest) options.rest = {};
  14.   options.rest.port = appEnv.isLocal ? options.rest.port : appEnv.port;
  15.   options.rest.host = appEnv.isLocal ? options.rest.host : appEnv.host;
  16.   // --------- ADD THIS SNIPPET ---------
  18.   const app = new TodoListApplication(options);
  20.   // --------- ADD THIS SNIPPET ---------
  21.   // If running on IBM Cloud, we get the Cloudant service details from VCAP_SERVICES
  22.   if (!appEnv.isLocal) {
  23.     // 'myCloudant' is the name of the provisioned Cloudant service
  24.     const updatedDatasourceDb = Object.assign({}, datasourceDb, {
  25.       url: appEnv.getServiceURL('myCloudant'),
  26.     });
  27.     app.bind('datasources.config.db').to(updatedDatasourceDb);
  28.   }
  29.   // --------- ADD THIS SNIPPET ---------
  30.   await app.boot();
  31.   await app.start();
  33.   const url = app.restServer.url;
  34.   console.log(`Server is running at ${url}`);
  35.   return app;
  36. }
  • Remove the prestart script from package.json, since we don’t want to doany building on the cloud.

Note:

If you make more changes to the application after this point, remember to run npm run build to transpile the code before deploying.

  • (Optional) At project root, create a file called .cfignore with thefollowing content:
  1. node_modules/
  2. .vscode/
  3. .git

This step is optional, however, dependencies will be installed duringdeployment and thus node_modules will be generated. It makes the upload ofnode_modules reductant and time consuming.

Step 5: Deploying the application to IBM Cloud

  • Use cf login command to login.

If you’re using a federated user id, you can use the —sso option.

After you’ve been successfully logged in, you’ll see the CF API endpoint.

  1. API endpoint: https://api.ng.bluemix.net (API version: 2.106.0)
  • After logging in, you can run this command:
  1. cf push <<your-app-name>>

The app name in the command is the Cloud Foundry application that will showup in the IBM Cloud dashboard.

Step 6: Binding the Cloudant service to your application

  • Go to the IBM Cloud dashboard (https://cloud.ibm.com/dashboard/apps).
  • Under Cloud Foundry Applications, you should see your application name.Click on it.
  • In the “Overview” tab, go to Connections > Create connection.
  • Select myCloudant service.
  • After the binding is done, you should see it from the Overview page.create connection
  • You will be asked to restart your application.

Step 7: Testing your endpoints

  • Go to your application page. If you’re not already in there, it can be foundunder Cloud Foundry Apps in theIBM Cloud dashboard.
  • Click Visit App URL to get the URL of your application. It will then bringyou to the API explorer for testing your endpoints.