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: whitesource.whitesource.task-hash-collector.WhiteSource@18
  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: NodeTool@0
  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: Npm@1
  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: Npm@1
  displayName: 'install angular cli@latest'
  inputs:
    command: custom
    workingDir: 'cctitan-ui-code'
    verbose: false
    customCommand: 'install -g @angular/cli@latest '

  • 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 Bolt@19
  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: ArchiveFiles@2
  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: PublishBuildArtifacts@1
  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: PublishTestResults@2
  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: AzureRmWebAppDeployment@3
  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

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