Deploy NodeJs , Angular application on K8s cluster

I have a requirement to deploy my nodeJs backend services and angular application to deploy on the Kubernetes cluster and expose those to the public internet.

Let’s deploy nodeJs app first,

• We need to create a docker container and add a nodeJs app to that. To do that add the below file to the node app.

Note: in this docker file I have added the “ RUN yarn add canvas “ command to install the canvas library to my docker container. you can use this method to install any library that needs from OS ( container level ), also you can remove this library because this is an optional line.

• Now we need to dockerize our angular app.
  Here I’m creating a docker container with Nginx application and add the angular app to /usr/share/nginx/html directory.

nginx.config

In Nginx configuration, the listening port is 3000 and angular build artifacts reside inside /usr/share/nginx/html folder also the main page is index.html file. In addition, if you have a different requirements please do the changes accordingly.

docker file for angular app

• Once you add the above configuration file to the angular app and node js app directory, execute the below commands as mention on the deploy.sh file.

deploy.sh file install all build and push command

Above deploy.sh file include,
* change the directory and fetch the latest code.
* login to the amazon ECR, this is can be changed on your requirement. There are multiple docker repositories you can push your docker images.
* Build and tag docker images.
* Push docker image to docker repository ( In my example I used amazon ECR ).

• Now we need to create the Kubernetes deployment configuration file as below. In that file include two sections,
• Deployment
  * apiVersion: apps/v1
  * kind: Deployment
  * metadata: define name what you need for the application
  * replicas: number of pod replicas you want
  * imagePullSecrets: this is depending on the docker registry, since I’m using amazon ecr , I put it as an “aws-registry”.
  * containers: section container name, image name, resource allocation, and containerPort should mention.
• Service
  * apiVersion: v1
  * kind: Service
  * metadata: define name what you need for the application
  * type: There are few port types i use here ClusterIP type.
  * port: is expose port from this services.
  * targetPort: is port that exposes from the docker container which is deployed in the pod.

k8s deployment and service configuration

• Now we need to define route configuration for the ingress controller.
  Here I’m using SSL certificates and HTTPS endpoints. Traffic coming to the DNS call “api.kiyuri.lk “ will route to the kiyuri-backend ( nodeJs backend ) service and traffic coming to the DNS call “kiyuri.lk “ will route to the kiyuri-admin ( angular frontend ) service. Also, I used letsencrypt SSL certificates.

note: please change the DNS names and URLs accordingly.

route configuration file.

After successfully create those files, execute the kubectl apply the command to each file. once after successfully deploy you will be able to access your angular app and node backend on the public internet as below image

Our e-learning web application

Feel free to ask any question, I’m always happy to answer. Cheers !!!!!