DEV Community

Nitin _Tayal
Nitin _Tayal

Posted on

Deploying a Node.js application into Azure App Service using Azure Repos and Github

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.

                               ---
Enter fullscreen mode Exit fullscreen mode

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

We start by creating a Microsoft Azure free tier account and Navigate to Azure Portal.
image

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

image

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

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

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

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

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

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

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

image

image

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

image

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

image

image

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

image

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

image

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

image

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

image

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

Azure release pipeline looks like this

image

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

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

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

image

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

image

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

image

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

image

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------------

Top comments (0)