Azure Pipelines: How to build and test an Angular and Node.js webapp

Azure Pipelines: Using and set up a webapp (part 1)

This will be the first part 5 part series about Azure Pipelines. In this first part I will explain to you how to set up your Azure Pipeline so it’s capable of deploying a Node.js and Angular webapp. We will use Node for the backend and Angular for the frontend.

Create your Azure Pipeline

First you have to create a pipeline. You can do this by going to Azure Devops. Create a new project and go to the pipelines tab. If you don’t see this tab, enable it. Do so by following the steps in this link:

Configure your git source and for now add an starter pipeline YAML. This azure-pipelines.yml will be added to your repo, so make sure to pull. Make sure it’s pushed on your own separate branch if you don’t want it to be on your master (it’s configured to push to master by default)

Multi-stage Pipelines

Second thing you have to do, is enable multi-stage pipelines. You can do this by doing the following:

Click on the user icon with settings. Next click on preview features
Switch on the multi-stage pipelines switch

This enables you to have multiple stages, which comes in handy when you want to divide the deploying stages. See also here for the documentation.
Your yaml should now look like this:

# Starter pipeline
# Start with a minimal pipeline that you can customize to build and deploy your code.
# Add steps that build, run tests, deploy, and more:
# https://aka.ms/yaml

trigger:
- master

pool:
  vmImage: 'ubuntu-latest'

steps:
- script: echo Hello, world!
  displayName: 'Run a one-line script'

- script: |
    echo Add other tasks to build, test, and deploy your project.
    echo See https://aka.ms/yaml
  displayName: 'Run a multi-line script'

You will be able to run your pipeline, but it won’t do much yet. Let’s change that! Continue in the next article.