Build and Deploy a Node.js Application into Azure Web Apps Using Azure DevOps (CI/CD)

Build and Deploy a Node.js Application into Azure Web Apps Using Azure DevOps (CI/CD)

This post is as an introduction to Azure DevOps. If you're new to this topic, check out a helpful DZone article&nbsp;<a href="https://dzone.com/articles/introduction-to-azure-pipelines?preview=true" target="_blank">here</a>.

In this tutorial, we look at how to get a Node.js app up and running and then deploy it to an instance of Azure DevOps.

This post is as an introduction to Azure DevOps. If you're new to this topic, check out a helpful DZone article here.

We'll use an azure-pipelines.yml file at the root of the repository. Get this file to build the Node.js application using CI (Continuous Integration) Build.

Follow the instructions in Create your build pipeline to create a build pipeline for your node application.

Steps:

  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
pool:
  name: Hosted Ubuntu 1604
  demands: npm
  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
steps:
- task: [email protected]
  displayName: 'WhiteSource '
  inputs:
    cwd: 'cctitan-ui-code'
    extensions: '.json .js .ts .css .html'
    productName: UIcode
    WhiteSourceService: 'cc-titan'
  enabled: false
  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
- task: [email protected]
  displayName: 'Use Node 8.x'
  inputs:
    versionSpec: 8.x
  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
task: [email protected]
  displayName: 'npm install'
  inputs:
    workingDir: 'cctitan-ui-code'
  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
- task: [email protected]
  displayName: 'install angular [email protected]'
  inputs:
    command: custom
    workingDir: 'cctitan-ui-code'
    verbose: false
    customCommand: 'install -g @angular/[email protected] '
  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
- bash: |
   ls /home/vsts/work/1/s
   cd cctitan-ui-code 
   ls
   ng --version
   ls
   ng build
   ls
  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
- task: whitesource.ws-bolt.bolt.wss.WhiteSource [email protected]
  displayName: 'WhiteSource Bolt'
  inputs:
    cwd: 'cctitan-ui-code'
  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
- bash: |
 cd CCtest
 npm install karma karma-jasmine karma-chrome-launcher karma-jasmine-html-reporter karma-coverage-istanbul-reporter
 npm install karma-coverage --save-dev
 npm install karma karma-coverage
 ng test --watch=false --code-coverage
displayName: 'CodeCOverage tests'
  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
- task: [email protected]
  displayName: 'Archive cctitan-ui-code/dist'
  inputs:
    rootFolderOrFile: 'cctitan-ui-code/dist'
    includeRootFolder: false
  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
- task: [email protected]
  displayName: 'Publish Artifact: drop'

Publish the test results to Azure pipelines or TFS when tests are executed to provide complete test reports and analytics. Use the test runner that supports the required test results format. Some specific result formats include JUnit, NUnit, and Visual Studio Test (TRX). This task will generate the JUnit XML formats, and Azure DevOps Build will use this XML file in its build task to grab the test results and publish to the dashboard summary of the build.

steps:
- task: [email protected]
  displayName: 'Publish Test Results **/test-results*.xml **/e2e-results-junit*.xml '
  inputs:
    testResultsFiles: |
     **/test-results*.xml
     **/e2e-results-junit*.xml
    mergeTestResults: true
  continueOnError: true
  condition: succeededOrFailed()
  • The agent pool needs to be selected on Microsoft-hosted agents. This is the VM where the build runs. If the hosted agent is not working, use the self-hosted agent machine as a host.
steps:
- task: [email protected]
  displayName: 'Deploy Azure App Service'
  inputs:
    azureSubscription: '$(Parameters.ConnectedServiceName)'
    appType: '$(Parameters.WebAppKind)'
    WebAppName: '$(Parameters.WebAppName)'
    TakeAppOfflineFlag: true

Further Reading

The Complete Node.js Developer Course (3rd Edition)

Build a Node.js Application Using Azure DevOps (CI/CD)

How you can do continuous delivery with Vue, Docker, and Azure

***Originally published by  Sudheer Mareddy *at dzone.com


Thanks for reading :heart: If you liked this post, share it with all of your programming buddies! Follow me on Facebook | Twitter

node-js azure

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

How to Hire Node.js Developers And How Much Does It Cost?

A Guide to Hire Node.js Developers who can help you create fast and efficient web applications. Also, know how much does it cost to hire Node.js Developers.

Hire Node.JS Developers | Skenix Infotech

We are providing robust Node.JS Development Services with expert Node.js Developers. Get affordable Node.JS Web Development services from Skenix Infotech.

Hands on with Node.Js Streams | Examples & Approach

The practical implications of having Streams in Node.js are vast. Nodejs Streams are a great way to handle data chunks and uncomplicate development.

Node.js Performance: Node.js vs. Io.js

You may already be aware that Raygun uses Node.JS for our API nodes that receive your precious crash reporting data (we also do node.js crash reporting if you’re interested). We’ve peaked in the past at more than 110,000 requests per second coming...

Node.js Live | Node.js Docker Tutorial | Dockerizing Node.js App|Node.js Training|Edureka

🔥 Node.js Certification Training: https://www.edureka.co/nodejs-certification-training This Edureka video on 'Node.js Docker Tutorial' will help you in learn...