Deploying a Node.js application into Azure App Service using Azure Repos and Github
Published: 2021-03-24 20:12:01

In this post, we would like to talk about various Deployment techniques that can be used to deploy a simple Node.js application into the Azure App Service.

Before we get into the technicalities of Azure App Service, we would like to touch upon the basics of Microsoft Azure and CI/CD.

CI/CD allows us to create and manage build processes that are automatically compiled and tested in the Cloud. This helps end-users to build software on multiple platforms without worrying much about installing software, taking care of various integration points, code repository, work management and build.

                                   ---
In this post, we will be showing steps to deploy a simple Node.js app in a Linux based App Service using various deployment techniques. We will talk about git deployments through Azure DevOps CI/CD and Kudu Engine.
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p9iieghw7e3010szz5j2.png) 
 
We start by creating a Microsoft Azure free tier account and Navigate to **[Azure Portal](https://portal.azure.com/#home)**.
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2l6ol2oca1ojl7me6vwm.png)

The initial view of the portal is shown below, where we would create a Resource group for the Web App.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/15k35gjyddqhcccgtes0.png)

A **resource group** is created in order to bind all the resources assigned to a project. The resources can be monitored from the Azure Dashboard. 
 
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sxzdo56s6cp3affsg87w.png)

While creating the resource group, we choose the type of Subscription and give a unique name to it. We also need to specify the region closest to us or our clients. After choosing all the fields, please review and create the Resource group.

The next step is to **create** an App service. The option to create the App Service is available in the Azure portal home page.

Click on the add button or create **App service**.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bb7nvhahwkxwz1kc578o.png)

After clicking, we need to fill in various information such as the current subscription, resource group, Instance Details, and App service plan, as shown below. 
 
**_Note: Instance Name should be globally unique._**


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/auya93ssa3e1iau66q4j.png)

We can enable monitoring in order to have full observability into the Application, infrastructure and the network. Add tags to categorize resources and finally Review all the parameters selected and create an App Service project. On successful deployment, an App Service resource gets created in the resource group.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xraym8vrxymg16xzbtn7.png)


From the Azure portal, choose the newly created App Service to access the dashboard. The dashboard shows numerous information related to the service including the Service state, Development tools, Deployment, and Monitoring. We will be focusing more on the Continuous Deployment aspect of the App Service.

In order to create an Azure DevOps CI/CD pipeline for an App Service, navigate to the **Deployment Center** from the **Azure dashboard**. Continuous deployment can be configured using various source controls such as Azure Repo, Github, bitbucket and Local Git. 
 

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hbmnhqhrgszepj244vtt.png)


We will be explaining in detail on how to configure build and deploy pipeline using Azure Repos and Github. Azure Repo explicitly uses Azure Pipeline to build and deploy, whereas Github can be deployed using Azure Pipeline as well as Kudu Engine.

#Configure build and deploy pipeline from Azure Repos using Azure pipeline 

As a first step create a new Azure DevOps project by accessing the **_Azure DevOps portal_**.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gg3xava5yvk7fa7bt34b.png)

With reference to the project created in the previous step, we create a repository (Azure Repos) and push the Node.js source code in it.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5qy5q4q9wbmb4bym6opo.png)


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x0r9vz6moiv1k9js9flr.png)


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/47nrhpigqvqj3ly4dujt.png)


Now coming back to the Development Center of the **App Service (name: helloworld993)** in the Azure portal.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1y6yck1zvjzmee1w2fse.png)


Select **Azure Repos** as the source control and continue to choose the Build Provider as **Azure Pipelines**.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gzgyo6nypyq9cqqsvv3f.png)


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/szz7804d0w31q18dcl90.png)


Next, we have to choose all the configurations related to the source code and the build

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/scs5hpad4s082tynfi9g.png)


Finally, we have to review the deployment summary and click on Finish.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/251j7wjd2sqgrpr3eayd.png)


Azure DevOps CI/CD pipeline is automatically created based on the parameters configured and the build process is initiated.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jpoywy6iml9k7yz0eoz9.png)


After successful deployment, we can access the application through the URL generated in the Azure app service:

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wq1f1ytwh0p1rzj7tdnb.png)


The Azure DevOps CI/CD pipeline that gets automatically created can be viewed and edited in **Dev Azure Portal**. Azure Continuous integration pipeline for Node.js app looks as shown below and it can be edited.


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6u6q5ut359um91xnlddb.png)
        


Azure release pipeline looks like this


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qo0h27sqa19r87vy0kic.png)


Similarly, we can configure the build and deploy pipeline for other source controls such as Github and Local Git using the Azure pipeline.

#Configure build and deploy pipeline from Github using Kudu
First, we have to Authorize our Github repository with Microsoft Azure.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n4s8uzixx0ajfqeajsdq.png)
  
   
 Once the Github account is successfully authorized, navigate to the Development Center of the Azure portal and click on Github as the source control and continue to choose the Build Provider as Kudu app service. App service Kudu engine builds the code during deployment (when applicable) without any additional configuration required.


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t3cu3oiljo74w60w6flp.png)


Next, we have to choose configurations related to the source code.


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ufc0cs2rt8yohufni3vb.png)

Finally, we have to review the deployment summary and click on Finish.


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bb0jclz5v8xno725eo1k.png)


App service Kudu engine automatically builds the Node.js app and does the deployment.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hzaqwqcg2vjb595mkvqj.png)


After successful deployment we can access the application through the URL generated in the Azure app service:


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/596819h730bkwjxyt33o.png)


In a similar way, the App service kudu engine can also build and deploy Node.js apps from the Local Git repository.

--------------Thanks For Reading------------