Overview

This tutorial shows how to deploy a LoopBack4application onto Kubernetes on theIBM Cloud.

Prerequisite

You’ll need the following:

  1. npm i -g @loopback/cli

After you have scaffolded a LoopBack4 application, you’ll get a default endpoint/ping. For simplicity sake, we’ll use this.

Step 1: Scaffold LoopBack 4 app

Run the lb4 app command, and specify all the values provided below.

  1. $ lb4 app
  2. ? Project name: lb4-simple-web-app
  3. ? Project description: lb4-simple-web-app
  4. ? Project root directory: lb4-simple-web-app
  5. ? Application class name: Lb4SimpleWebAppApplication
  6. ? Select features to enable in the project (Press <space> to select, <a> to toggle all, <i> to invert selection)
  7.  ◉ Enable eslint: add a linter with pre-configured lint rules
  8.  ◉ Enable prettier: install prettier to format code conforming to rules
  9.  ◉ Enable mocha: install mocha to run tests
  10.  ◉ Enable loopbackBuild: use @loopback/build helpers (e.g. lb-eslint)
  11.  ◉ Enable vscode: add VSCode config files
  12.  ◉ Enable docker: include Dockerfile and .dockerignore
  13.  ◉ Enable repositories: include repository imports and RepositoryMixin
  14.  ◉ Enable services: include service-proxy imports and ServiceMixin
  15. (Move up and down to reveal more choices)

The lb4-simple-web-app project is created.

Navigate to the main directory of the project

  1. cd lb4-simple-web-app

Step 2: Run the application locally

In a command window in the main directory of your project, type:

  1. npm start

The application will build, and then the server should start up successfully anddisplay

  1. Server is running at http://[::1]:3000
  2. Try http://[::1]:3000/ping

Open your browser and attempt to access all these urls

lb4_k8s_ibm_cloud_app_website_1.png

Make sure that the application runs well before continuing to the next step.

In the command window, stop the application with

  1. Ctrl + C

Step 3: Build a Docker image

Review the two Docker-related files that have been conveniently provided,.dockerignore and Dockerfile, but leave them unchanged for this tutorial.

Notice the HOST and PORT environment variable values:

  1. ENV HOST=0.0.0.0 PORT=3000

In the package.json file, a docker:build command has been provided.

  1. "docker:build": "docker build -t lb4-simple-web-app ."

Run the command:

  1. npm run docker:build

When it completes, you will see :

  1. Successfully built 7d26df6c1561
  2. Successfully tagged lb4-simple-web-app:latest

You can find your image by typing:

  1. docker images | grep lb4-simple-web-app

It will display something like this :

  1. lb4-simple-web-app   latest 7d26df6c1561

Step 4: Run the application in Docker

In the package.json file, a docker:run command has been provided.

  1. "docker:run": "docker run -p 3000:3000 -d lb4-simple-web-app"

Run the command:

  1. npm run docker:run

Afterwards, type:

  1. docker ps

You should see something like this:

  2. CONTAINER ID   IMAGE                COMMAND          CREATED             STATUS         PORTS
  3. a9962339e863   lb4-simple-web-app   "node ."         8 seconds ago       Up 7 seconds   0.0.0.0:3000->3000/tcp

To see the log output of your container, you can type:

  1. docker logs <container id>    For example : a9962339e863

You should see something like:

  1. Server is running at http://127.0.0.1:3000
  2. Try http://127.0.0.1:3000/ping

Open your browser and attempt to access all these urls

http://127.0.0.1:3000/

http://127.0.0.1:3000/ping

http://127.0.0.1:3000/explorer

http://127.0.0.1:3000/openapi.json

Step 5: Stop the application running in Docker

Find the container id

  1. docker ps | grep lb4

You should see something like this:

  1. a9962339e863        lb4-simple-web-app      "node ."

The leftmost value is the container id.

Type:

  1. docker stop <container id>         For example : a9962339e863

Step 6: Log into IBM Cloud using ibmcloud login command

Use ibmcloud login command to login.

Tip: Since I’m using a federated user id (IBMid), I use ibmcloud login –sso to login.

After you’ve been successfully logged in, you’ll see something like:

  1. API endpoint:      https://api.ng.bluemix.net
  2. Region:            us-south
  3. User:              dremond@ca.ibm.com
  4. Account:           Dominique Emond's Account
  5. Resource group:    default
  6. CF API endpoint:
  7. Org:
  8. Space:

Step 7: Log into IBM Cloud Container Registry

  1. ibmcloud cr login

You should see:

  1. Logging in to 'registry.ng.bluemix.net'...
  2. Logged in to 'registry.ng.bluemix.net'.
  3. OK

Step 8: Upload a docker image to the Container Registry

This requires several steps, let’s quickly go through them.

Create a namespace

List your current namespace by typing:

  1. ibmcloud cr namespace-list

If you want to create a new namespace for yourself, you can do so with thiscommand:

  1. ibmcloud cr namespace-add <my_namespace>

Tip: I will be using my namespace dremond in the commands that follow.

Tag your local docker image with the IBM Cloud container registry

Here is the command:

  1. docker tag <source_image>:<tag> registry.<region>.bluemix.net/<my_namespace>/<new_image_repo>:<new_tag>

<source_image>:<tag> is what you have on your machine that you createdearlier.

For example : lb4-simple-web-app:latest

registry.<region>.bluemix.net is the container registry region you logged intobefore.

For example : registry.ng.bluemix.net

<my_namespace> is the namespace you created for yourself

For example : dremond

<new_image_repo>:<new_tag> can be whatever you want it to be; they don’t haveto exist yet

For example : loopback4_webapp_repo:1

So, putting these values together, my command will look like this:

  1. docker tag lb4-simple-web-app:latest registry.ng.bluemix.net/dremond/loopback4_webapp_repo:1

Push the local image to the container registry

  1. docker push registry.ng.bluemix.net/dremond/loopback4_webapp_repo:1

You will see a progress bar like this:

  1. The push refers to repository [registry.ng.bluemix.net/dremond/loopback4_webapp_repo]
  2. 478b1e842aa3: Pushed
  3. 6fd2223ea65e: Pushed
  4. a90c4aba186a: Pushing [============>                                      ]   51.4MB/207.9MB
  5. bb288a38c607: Pushed
  6. 53981d6ec3d2: Mounted from dremond/loopback4_repo
  7. b727cac390f6: Mounted fro

Wait until it is completed.

  1. The push refers to repository [registry.ng.bluemix.net/dremond/loopback4_webapp_repo]
  2. 478b1e842aa3: Pushed
  3. 6fd2223ea65e: Pushed
  4. a90c4aba186a: Pushed
  5. bb288a38c607: Pushed
  6. 53981d6ec3d2: Mounted from dremond/loopback4_repo
  7. b727cac390f6: Mounted from dremond/loopback4_repo
  8. df64d3292fd6: Mounted from dremond/loopback4_repo
  9. 1: digest: sha256:939ada9d1b7f6a7483aed69dff5ccc28d1931ed249b38d51d34b854b32139177 size: 1787

Verify the image is in the container registry

Type the command :

  1. ibmcloud cr image-list

You should see your image listed.

lb4_k8s_ibm_cloud_container_registry_1.png

Tip: One important column is the last one on the right ‘Security Status’. Initially it will have a value of ‘Scanning…’ . Wait until the scanning is complete. My image has a ‘No Issues’ status. This is good. If it instead stated ‘9 Issues’ (in red), then I would need to take some extra steps later on in my account to view the issues, figure out a way to resolve them, or create an Exemption for them. Managing image security with Vulnerability Advisor

Perform a build for the container registry

Perform a build for the container registry.

  1. ibmcloud cr build -t registry.ng.bluemix.net/dremond/loopback4_webapp_repo:1 .

Tip: Don’t forget the trailing period…it won’t work without it.

This step may fail if you have exceeded the QUOTA for images in your account. Inthat case clear up some room and try again.

Wait until it completes.

In your IBM Cloud account, you can view your imageshere.

Step 9: Point to your Kubernetes Cluster

In a browser, log into your IBM Cloud account, and navigate to Kubernetes >Clusters.

lb4_k8s_ibm_cloud_kubernetes_cluster_1.png

I am choosing my cluster dremondOne in Dallas .

( If you do not have a Kubernetes cluster, you can create one for free by goingto https://cloud.ibm.com/containers-kubernetes/overview , clicking on the'Create a cluster' button, specifying a Resource Group of 'default', aLocation of 'Dallas', choosing a Cluster Type of 'Free', and giving it aname. )

Select the ‘Access’ tab of your cluster and follow the instructions.

lb4_k8s_ibm_cloud_cluster_access_1.png

We already logged into the IBM Cloud in an earlier step, so we only need topoint to the cluster.

  1. ibmcloud cs region-set us-south
  1. ibmcloud cs cluster-config <Cluster Name>

My cluster name is ‘dremondOne’ so I see this output:

  1. OK
  2. The configuration for dremondOne was downloaded successfully. Export environment variables to start using Kubernetes.
  4. export KUBECONFIG=/Users/dremond/.bluemix/plugins/container-service/clusters/dremondOne/kube-config-hou02-dremondOne.yml

Take the entire ‘export’ line above, and paste it into your command window.

Now you should be able to perform Kubernetes commands like:

  1. kubectl get nodes

You will see output like this:

  1. NAME           STATUS    ROLES     AGE       VERSION
  2. 10.76.193.58   Ready     <none>    13d       v1.10.8+IKS

Ok, so now we are ready to deploy our Loopback4 application to Kubernetes!

Step 10: Deploy your Loopback4 application to Kubernetes

Create a deployment

Create a deployment named : lb4-simple-web-app-deployment ; using the image weplaced in the container registry.

  1. kubectl run lb4-simple-web-app-deployment --image=registry.ng.bluemix.net/dremond/loopback4_webapp_repo:1

Verify that the pods are running

  1. kubectl get pods

You should see

  1. NAME                                             READY     STATUS             RESTARTS   AGE
  2. lb4-simple-web-app-deployment-5bfcb546d8-r7cs4   1/1       Running            0          7m

A status of ‘Running’ is a good sign. If you have anything other than this,then there may be something wrong with your docker image , or it may havevulnerability issues you need to address.

To see the logs of your pod, type:

  1. kubectl logs lb4-simple-web-app-deployment-5bfcb546d8-r7cs4

and you will see something like this:

  1. Server is running at http://127.0.0.1:3000
  2. Try http://127.0.0.1:3000/ping

Create a service

Expose your deployment with a service named : lb4-simple-web-app-service

  1. kubectl expose deployment/lb4-simple-web-app-deployment --type=NodePort --port=3000 --name=lb4-simple-web-app-service --target-port=3000

Obtain the NodePort of your service

Let’s determine the NodePort of your service.

  1. kubectl describe service lb4-simple-web-app-service

You will see output like this:

  1. Name:                     lb4-simple-web-app-service
  2. Namespace:                default
  3. Labels:                   run=lb4-simple-web-app-deployment
  4. Annotations:              <none>
  5. Selector:                 run=lb4-simple-web-app-deployment
  6. Type:                     NodePort
  7. IP:                       172.21.103.26
  8. Port:                     <unset>  3000/TCP
  9. TargetPort:               3000/TCP
  10. NodePort:                 <unset>  31701/TCP
  11. Endpoints:                172.30.78.136:3000
  12. Session Affinity:         None
  13. External Traffic Policy:  Cluster
  14. Events:                   <none>

In this case, the NodePort is 31701 .

Obtain the public IP address of the cluster

Let’s determine the public IP address of the cluster

  1. ibmcloud ks workers dremondOne

You should see something like this

  1. OK
  2. ID                        Public IP       Private IP     Machine Type   State    Status
  3. kube-hou02-pa45e...6-w1   184.173.5.187   10.76.193.58   free           normal   Ready

In my case, the public IP is: 184.173.5.187

So now we can formulate the url of our loopback4 application using those twopieces :

  1. http://184.173.5.187:31701

Open your browser and attempt to access all these urls

  1. http://184.173.5.187:31701/
  3. http://184.173.5.187:31701/ping
  5. http://184.173.5.187:31701/explorer
  7. http://184.173.5.187:31701/openapi.json

lb4_k8s_ibm_cloud_app_website_on_cloud_k8s.png

Step 11: View your app in the Kubernetes Dashboard

Let’s go take a look at your application in the Kubernetes dashboard.

Click the ‘Kubernetes Dashboard’ button next to your cluster’s name.

lb4_k8s_ibm_cloud_k8s_dashboard_1.png

Under ‘Workloads’, select ‘Pods’

lb4_k8s_ibm_cloud_k8s_dashboard_2.png

Locate your application, and click on its name

lb4_k8s_ibm_cloud_k8s_dashboard_3.png

If you want to open a shell into the container in the pod, click on the EXECbutton.

If you want to view the logs of the container in the pod, click on the LOGSbutton.

lb4_k8s_ibm_cloud_k8s_dashboard_4.png

So there you have it! You have successfully deployed a Loopback4 application toKubernetes on the IBM Cloud.

References