Skip to content

ibm-cloud-architecture/node-web-app

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

GitOps with Tekton and ArgoCD

Simple Node JS App Soup to Nuts: From DeskTop Docker to OpenShift Cluster

This git repo is a simple contains a simple node applicaiton that uses argocd to deploy its tekton pipeline to OpenSHift 4.3. It the uses Tekton to build an image, publish it to the Container Registry and executes an argo sync to deploy the app.

alt argo-flow-1

Create a Fork of this Repo for your own fun.

  1. Since you are running a GitOps Example, you want to create a fork of this repo into your own git-repo

    alt fork-repo

  2. Select your user

    alt fork-repo-2

  3. You want to create a Clone of your new repo

 git clone https://github.com/<your-user>/node_web_app.git

 cd node_web_app

Run Node App and Test Locally with Docker or Podman

The Node Applicaiton is created following this tutorial simulating how a new user might learn to containerize a Node App.
Dockerizing a Node.js web app

  1. To run the applicaiton locally, Install Docker Desktop or you could use podman on Linux (This assumes you use podman CLI instead of docker. Substitute docker with podman )

  2. You can run the app locally if you have node installed

npm install 
node server.js

  1. Since you have the code, docker build
docker build -t <your username>/node-web-app .

If you want to use podman locally, follow directions here to build with buildah.

  1. Run the applicaiton in a container.
docker run -p 49160:8080 -d <your username>/node-web-app

  1. Check that the container is running.
docker ps
  1. Test the Application
curl -i localhost:49160

Change Pipeline Resource to your git repo.

This change is required to run a build from the console without a Trigger Event.

alt fork-repo

Using OpenShift 4.3 as my Kubernetes Cluster

You need your own 4.3 OpenShift Cluster. Here are some options.

I installed OpenShift 4.3 into AWS following these instructions.

You could use Code Ready Containers Locally.

This tutorial can work also on any Kubernetes, but you have to install Tekton and use the buildah task.

Needed CLI and log into OpenShift

You need the following CLI's

Log into your OpenShift Cluster should automatically log you into kubernetes and tekton.

oc login --server=https://<OCP API Server>  --token=<Your Auth Token>

Your ID should use an ID with admin access since you will be installing a set of tools.

You can also log into your OpenShift web console.

Install ArgoCD Operator into OpenShift

There are a few ways to install argocd into a Kubernetes Cluster. We used the Argo CD Operator.

For this tutorial, I used the Console Install using the Argo CD Operator on OpenShift.

Install OpenShift Pipeline Operator

OpenShift delivers a preview of tekton through the OpenShift Pipeline Operator. We used the OpenShift Pipeline Operator.

For this tutorial I follwed the instructions to install the OpenShift Pipeline Operator.

Install the Argo CD Tekton Task into the argocd namespace

After tekton builds the application and pushed the container image into the Image Repository, tekton needs to trigger a new OpenShift Deployment. There is a special task that allows Tekton to trigger a argocd sync. You have to install the Argo CD Tekton Task

Create OCP Project

You need to create an OpenShift project called node-web-project or you will need to change all namespaces in the YAML File to match your project

oc new-project node-web-project

Allow Pipeline to access registry for build and deploy

Your project will need the ability to publish and pull from the image repository.

oc policy add-role-to-user registry-editor builder

oc policy add-role-to-user registry-editor deployer

Update argocd secret.

alt argo-secret

There is a file caled node-web-app-argocdsecret.template. Create a copy of that file as yaml.

cd pipeline
cp node-web-app-argocdsecret.template  node-web-app-argocdsecret.yaml

CAUTION !!!!! the .gitigonore file contains the name of this yaml file to avoid checkin of your credentials. If you use another name, then you must make sure you DO NOT CHECKIN credentials.

alt git-ignore

In the newly created file, replace the value for ARGOCD_SERVER to your server. Either enter your ARGOCD_AUTH_TOKEN or User and Password Base 64 encoded.

alt argo-secret

Examime Pipeline YAML

Examine the Tekton Files. A Quick summary of Tekton Resources can be read here. You already saw one of the YAML files to configure the secret.

node-web-app-pipeline-resources.yaml: Pipeline Resources configured for the pipeline. There are 2, the name of the git repository and the name of the Container Image using the Internal Red Hat Registry. Note, the resources here allow us to do a Pipeline Run fomr the console or oc commandline. It hard codes default values. They will be overridden by Trigger Template when builds are done via a git push.

node-web-app-pipeline.yaml: Our Pipeline for building, publishng, and deploying our Node App. There are 2 Tasks. We make use of some default tasks rather than creating our own. A real life pipeline will execute tests, tag images, and so forth. Tasks:

  • the build-and-publish-image uses the ClusterTask buildah (podman build system).
  • argocd-sync-deployment uses the argocd Task we installed earlier

node-web-app-triggertemplate.yaml: Now that the pipeline is setup, there are several resources created in this file. They create the needed resources for triggering builds from an external source, in our case a Git webhook. You can learn more about Tekton Triggers here. We have created the following.

  • A TriggerTemplate is used to create a template of the same pipeline resources, but dynamically genertaed to not hard code image name or source. It also creates a PipelineRun Template that will be created when a build is triggered.

  • A TriggerBining that binds the incoming event data to the template (this will populte things like git repo name, revision,etc....)

  • An EventListener that will create a pod application bringing together a binding and a template.

  • An OpenShift Route to expose the Event Listener. Your will create a GIT Webhook that will callback this Route.

You can learn about Tekton Resources and OpenShift Pipleines

Create and configure ArgoCD App for Tekton Resources

We can use argocd to deploy the tekton build for the app. IN a real project, having your pipeline in a separate repo might be better. You can create an argo cd app via the GUI or commandline.

The screenshot below shows the parameters I entered. You need to use your own forked git repo.

alt argo-pipeline

  • Project: default
  • cluster: (URL Of your OpenShift Cluster)
  • namespace should be the name of your OpenShift Project
  • Targer Revision: Head
  • PATH: pipeline
  • AutoSync Enabled.

Once you run sync, your pipeline should be deployed and your screen in argo should look like below.

alt argo-pipeline

Run a Build

At this point you can run a build. The Build Should succeed, but the deploy should fail. If you configure the deployment first however, deloyment will fail to start because the image has not been published.

  1. You can go into the Pipelines section of the OpenShift Console, right click the pipeline and click Start.

alt kickoff

  1. You will see that the values are prepopulated with default PipelineResources as shown below.

alt default-resources

  1. The pipeline should run, the build should pass (Creates the Container Image and publishes it to the Container Registry). The argo-cd sync should fail because we have not configured the argod app for deploying the node-web-project.

alt first-run

Examine Application

Let's look at the OpenShift Configuration for our node application.

alt deployment

Create ArgoCD App for Web App Resources

Just like we used argocd to deploy the tekton pipeline, you will create another argocd app that corresponds to the deployment. You can create an argo cd app via the GUI or commandline.

The screenshot below shows the parameters I entered. You need to use your own forked git repo.

alt argo-pipeline

  • Project: default
  • cluster: (URL Of your OpenShift Cluster)
  • namespace should be the name of your OpenShift Project
  • repo url: should be your forked git repo.
  • Targer Revision: Head
  • PATH: deployment
  • AutoSync Disabled.

Sync Repo

From here, you can trigger a sync manually by clicking sync. Once your resources are deployed, your build from earlier is complete. The screen should look like the figure below.

alt node-flow

Run Pipeline

  1. You can go into the Pipelines section of the OpenShift Console, right click the pipeline and click Start.

alt kickoff

  1. You will see that the values are prepopulated with default PipelineResources as shown below.

alt default-resources

  1. The pipeline should run, should now complete.

alt build-success

Configure Webhooks

You will now need to configure 2 WebHooks.

alt webhooks

  1. One WebHook will be configured to our argocd pipeline app. This will enabled you to push changes to your pipeline plus for argocd to detect changes for your app (though autosync is not on)

    alt webhooks

  2. One webhook will go to your Tekton Event Listener to start a tekton build from git push

    alt webhooks

Make a code change and commit, look at build.

  1. Make a change to the deployment YAML.

    alt change-deployment

  2. Make a change to the Node JS Code.

    alt webhooks

  3. Push the changes to your repo


git add .
git commit -m "First Deployment"
git push

In a real deployment, you might have many webhooks.  git push can be build to dev while a git tag can be a build for test.  
  1. Go to the OpenShift Console and you should see a pipleine run kickoff. Wait till it is complete. Notice the name of the pipleine run matches that in the tigger template.

    alt webhooks

  2. While waiting for the build, go to pipeline resources section and look to see new pipeline resources created for the webhook build. It will dynamically create a resource for build so you know what parameters were used to run the build.

    alt resourcebuild

  3. Go back to the Pipeline Runs and check that the build is complete.

    alt success

  4. Go to the Topology view on the Developer Side and launch the app as shown.

    alt success

  5. If it all works out, your app should look like this

This completes loading the solution.

Troubleshooting

  • argocd runs in an argocd namespace. Yourtekton pipleine runs in your app namespace.

  • using tkn log intance to see tekton activity

  • oc logs for various pods

  • Redeploying TriggerTemplate does not cause the Event App to restart. Delete pod to run new instance.

About

GitOps with Node JS, Tekton, ArgoCD, OCP

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 50.6%
  • Dockerfile 49.4%