Tutorial: criar um pipeline de várias fases com o Azure DevOps

Serviços Azure DevOps | Azure DevOps Server | Azure DevOps Server 2022

Use um pipeline multiestádido do Azure DevOps para dividir o processo de CI/CD em estágios que representam diferentes partes do ciclo de desenvolvimento. Um pipeline de vários estágios dá mais visibilidade ao processo de implantação e facilita a integração de aprovações e verificações.

Neste artigo, você criará duas instâncias do Serviço de Aplicativo e criará um pipeline YAML com três estágios:

Em um cenário real, você pode ter outra fase para a implantação em produção, dependendo do processo de DevOps.

O código de exemplo neste exercício é para uma aplicação web em .NET de um jogo espacial fictício que inclui um ranking para exibir as maiores pontuações. Você implantará instâncias de desenvolvimento e de preparação do Aplicativo Web do Azure para Linux.

Pré-requisitos

Produto Requisitos
Azure DevOps – Uma organização e um projeto do Azure DevOps. Crie um gratuitamente.
- Permissões:
    – Para conceder acesso a todos os pipelines no projeto: você deve ser membro do grupo Administradores do Projeto.
    – Para criar conexões de serviço: você deve ter a função Administrador ou Criador para conexões de serviço.
- A capacidade de executar pipelines em agentes hospedados pela Microsoft. Habilite a camada gratuita ou compre um trabalho paralelo.
GitHub - Uma conta do GitHub .

Criar fork do projeto

Faça um fork do repositório de exemplo a seguir no GitHub.

https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web-deploy

Criar as instâncias do App Service

Antes de implantar o pipeline, você precisa primeiro criar uma instância do App Service na qual implantar. Você usará a CLI do Azure para criar a instância.

  1. Entre no portal do Azure.

  2. No menu, selecione Cloud Shell e a experiência Bash.

  3. Gerar um número aleatório que torne exclusivo o nome de domínio do seu aplicativo Web. A vantagem de ter um valor exclusivo é que sua instância do Serviço de Aplicativo não terá um conflito de nome com outros estudantes que estiverem concluindo este tutorial.

    webappsuffix=$RANDOM    
    
  4. Abra um prompt de comando e use um comando az group create para criar um grupo de recursos chamado tailspin-space-game-rg que contenha todas as instâncias do Serviço de Aplicativo. Atualize o valor location para usar sua região mais próxima.

    az group create --location eastus --name tailspin-space-game-rg
    
  5. Use o prompt de comando para criar um plano do Serviço de Aplicativo.

    az appservice plan create \
      --name tailspin-space-game-asp \
      --resource-group tailspin-space-game-rg \
      --sku B1 \
      --is-linux
    
  6. No prompt de comando, crie duas instâncias do Serviço de Aplicativo, uma para cada instância (Desenvolvimento e Preparo) com o comando az webapp create.

    az webapp create \
      --name tailspin-space-game-web-dev-$webappsuffix \
      --resource-group tailspin-space-game-rg \
      --plan tailspin-space-game-asp \
      --runtime "DOTNET|8.0"
    
    az webapp create \
      --name tailspin-space-game-web-staging-$webappsuffix \
      --resource-group tailspin-space-game-rg \
      --plan tailspin-space-game-asp \
      --runtime "DOTNET|8.0"
    
  7. Use o Prompt de Comando para listar ambas as instâncias do App Service e verificar se estão em execução com o comando az webapp list.

    az webapp list \
      --resource-group tailspin-space-game-rg \
      --query "[].{hostName: defaultHostName, state: state}" \
      --output table
    
  8. Copie os nomes das instâncias do Serviço de Aplicativo para usá-los como variáveis na próxima seção.

Criar projeto e variáveis do Azure DevOps

Configure seu projeto de Azure DevOps e um pipeline de build. Você também adicionará variáveis para as instâncias de desenvolvimento e preparação.

Seu pipeline de build:

  • Inclui um gatilho que é executado quando há uma alteração de código na branch
  • Define duas variáveis, buildConfiguration e releaseBranchName
  • Inclui uma fase chamada Compilação que cria o aplicativo Web
  • Publica um artefato que será usado em uma fase posterior

Adicione o estágio de Compilação

  1. Em seu projeto do Azure DevOps, selecione Pipelines no menu de navegação à esquerda.

  2. Selecione Novo fluxo ou Criar fluxo se este fluxo for o primeiro do projeto.

  3. Na tela Onde está o código , selecione GitHub.

  4. Você pode ser redirecionado para o GitHub para então entrar. Nesse caso, insira suas credenciais do GitHub.

  5. Na tela Selecionar um repositório , selecione o repositório em que seu aplicativo .NET está.

  6. Você poderá ser redirecionado ao GitHub para instalar o aplicativo do Azure Pipelines. Se sim, selecione Aprovar e instalar.

  1. Quando a guia Configurar for exibida, selecione Pipeline inicial.

  2. Substitua o conteúdo do azure-pipelines.yml por este código.

    trigger:
    - '*'
    
    variables:
      buildConfiguration: 'Release'
      releaseBranchName: 'release'
    
    stages:
    - stage: 'Build'
      displayName: 'Build the web application'
      jobs: 
      - job: 'Build'
        displayName: 'Build job'
        pool:
          vmImage: 'ubuntu-22.04'
          demands:
          - npm
    
        variables:
          wwwrootDir: 'Tailspin.SpaceGame.Web/wwwroot'
          dotnetSdkVersion: '8.x'
    
        steps:
        - task: UseDotNet@2
          displayName: 'Use .NET SDK $(dotnetSdkVersion)'
          inputs:
            version: '$(dotnetSdkVersion)'
    
        - task: Npm@1
          displayName: 'Run npm install'
          inputs:
            verbose: false
    
        - script: './node_modules/.bin/node-sass $(wwwrootDir) --output $(wwwrootDir)'
          displayName: 'Compile Sass assets'
    
        - task: gulp@1
          displayName: 'Run gulp tasks'
    
        - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt'
          displayName: 'Write build info'
          workingDirectory: $(wwwrootDir)
    
        - task: DotNetCoreCLI@2
          displayName: 'Restore project dependencies'
          inputs:
            command: 'restore'
            projects: '**/*.csproj'
    
        - task: DotNetCoreCLI@2
          displayName: 'Build the project - $(buildConfiguration)'
          inputs:
            command: 'build'
            arguments: '--no-restore --configuration $(buildConfiguration)'
            projects: '**/*.csproj'
    
        - task: DotNetCoreCLI@2
          displayName: 'Publish the project - $(buildConfiguration)'
          inputs:
            command: 'publish'
            projects: '**/*.csproj'
            publishWebProjects: false
            arguments: '--no-build --configuration $(buildConfiguration) --output $(Build.ArtifactStagingDirectory)/$(buildConfiguration)'
            zipAfterPublish: true
    
        - publish: '$(Build.ArtifactStagingDirectory)'
          artifact: drop
    
  3. Ao final, selecione Salvar e executar.

Adicionar variáveis de instância

  1. No Azure DevOps, acesse Pipelines>Biblioteca.

  2. Selecione + Variable group.

  3. Em Propriedades, em Nome do grupo de variáveis, adicione Release.

  4. Crie duas variáveis para se referir aos nomes dos hosts de desenvolvimento e de preparação. Substitua o valor 1234 pelo valor correto para a instância.

    Nome da variável Valor de exemplo
    WebAppNameDev tailspin-space-game-web-dev-1234
    WebAppNameStaging tailspin-space-game-web-staging-1234
  5. Selecione Salvar para salvar as variáveis.

Adicionar a fase de Desenvolvimento

Em seguida, você atualizará o pipeline para promover sua compilação para a fase de Desenvolvimento.

  1. No Azure Pipelines, acesse Pipelines>Pipelines.

  2. Selecione Editar no menu de contexto para editar o pipeline.

    Captura de tela do item de menu Editar selecionado.

  3. Atualize o azure-pipelines.yml para incluir uma fase de Desenvolvimento. Na fase de Desenvolvimento, o pipeline irá:

    trigger:
    - '*'
    
    variables:
      buildConfiguration: 'Release'
      releaseBranchName: 'release'
    
    stages:
    - stage: 'Build'
      displayName: 'Build the web application'
      jobs: 
      - job: 'Build'
        displayName: 'Build job'
        pool:
          vmImage: 'ubuntu-22.04'
          demands:
          - npm
    
        variables:
          wwwrootDir: 'Tailspin.SpaceGame.Web/wwwroot'
          dotnetSdkVersion: '8.x'
    
        steps:
        - task: UseDotNet@2
          displayName: 'Use .NET SDK $(dotnetSdkVersion)'
          inputs:
            version: '$(dotnetSdkVersion)'
    
        - task: Npm@1
          displayName: 'Run npm install'
          inputs:
            verbose: false
    
        - script: './node_modules/.bin/node-sass $(wwwrootDir) --output $(wwwrootDir)'
          displayName: 'Compile Sass assets'
    
        - task: gulp@1
          displayName: 'Run gulp tasks'
    
        - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt'
          displayName: 'Write build info'
          workingDirectory: $(wwwrootDir)
    
        - task: DotNetCoreCLI@2
          displayName: 'Restore project dependencies'
          inputs:
            command: 'restore'
            projects: '**/*.csproj'
    
        - task: DotNetCoreCLI@2
          displayName: 'Build the project - $(buildConfiguration)'
          inputs:
            command: 'build'
            arguments: '--no-restore --configuration $(buildConfiguration)'
            projects: '**/*.csproj'
    
        - task: DotNetCoreCLI@2
          displayName: 'Publish the project - $(buildConfiguration)'
          inputs:
            command: 'publish'
            projects: '**/*.csproj'
            publishWebProjects: false
            arguments: '--no-build --configuration $(buildConfiguration) --output $(Build.ArtifactStagingDirectory)/$(buildConfiguration)'
            zipAfterPublish: true
    
        - publish: '$(Build.ArtifactStagingDirectory)'
          artifact: drop
    
    - stage: 'Dev'
      displayName: 'Deploy to the dev environment'
      dependsOn: Build
      condition:  succeeded()
      jobs:
      - deployment: Deploy
        pool:
          vmImage: 'ubuntu-22.04'
        environment: dev
        variables:
        - group: Release
        strategy:
          runOnce:
            deploy:
              steps:
              - download: current
                artifact: drop
              - task: AzureWebApp@1
                displayName: 'Azure App Service Deploy: dev website'
                inputs:
                  azureSubscription: 'your-subscription'
                  appType: 'webAppLinux'
                  appName: '$(WebAppNameDev)'
                  package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip'
    
  4. Altere a tarefa AzureWebApp@1 para usar sua assinatura.

    1. Selecione Configurações para a tarefa.

      Captura de tela da opção de configurações na tarefa do editor YAML.

    2. Atualize o valor your-subscription da Assinatura do Azure para usar sua própria assinatura. Talvez seja necessário autorizar o acesso como parte desse processo. Se você tiver um problema ao autorizar o recurso no editor YAML, uma abordagem alternativa será criar uma conexão de serviço.

      Captura de tela do item de menu da assinatura do Azure.

    3. Defina o Tipo de aplicativo como Aplicativo Web no Linux.

    4. Selecione Adicionar para atualizar a tarefa.

  5. Salve e execute o pipeline.

Adicionar a fase de Preparo

Por fim, você promoverá o estágio Dev para Staging. Ao contrário do ambiente de Desenvolvimento, você deseja ter mais controle no ambiente de preparo; para isso, adicione uma aprovação manual.

Criar ambiente de preparo

  1. No Azure Pipelines, selecione Ambientes.

  2. Selecione Novo ambiente.

  3. Crie um novo ambiente com o nome staging e o Recurso definido como Nenhum.

  4. Na página do ambiente de preparo, selecione Aprovações e verificações.

    Captura de tela da opção de menu de aprovações e verificações.

  5. Selecione Aprovações.

  6. Em Aprovadores, selecione Adicionar usuários e grupos e, em seguida, selecione a conta.

  7. Em Instruções para aprovadores, escreva Aprove esta alteração quando estiver pronta para homologação.

  8. Selecione Salvar.

Adicionar nova fase ao pipeline

Você adicionará um novo estágio, Staging, ao pipeline que inclui uma etapa de aprovação manual.

  1. Edite o arquivo de pipeline e adicione a seção Staging.

    trigger:
    - '*'
    
    variables:
      buildConfiguration: 'Release'
      releaseBranchName: 'release'
    
    stages:
    - stage: 'Build'
      displayName: 'Build the web application'
      jobs: 
      - job: 'Build'
        displayName: 'Build job'
        pool:
          vmImage: 'ubuntu-22.04'
          demands:
          - npm
    
        variables:
          wwwrootDir: 'Tailspin.SpaceGame.Web/wwwroot'
          dotnetSdkVersion: '8.x'
    
        steps:
        - task: UseDotNet@2
          displayName: 'Use .NET SDK $(dotnetSdkVersion)'
          inputs:
            version: '$(dotnetSdkVersion)'
    
        - task: Npm@1
          displayName: 'Run npm install'
          inputs:
            verbose: false
    
        - script: './node_modules/.bin/node-sass $(wwwrootDir) --output $(wwwrootDir)'
          displayName: 'Compile Sass assets'
    
        - task: gulp@1
          displayName: 'Run gulp tasks'
    
        - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt'
          displayName: 'Write build info'
          workingDirectory: $(wwwrootDir)
    
        - task: DotNetCoreCLI@2
          displayName: 'Restore project dependencies'
          inputs:
            command: 'restore'
            projects: '**/*.csproj'
    
        - task: DotNetCoreCLI@2
          displayName: 'Build the project - $(buildConfiguration)'
          inputs:
            command: 'build'
            arguments: '--no-restore --configuration $(buildConfiguration)'
            projects: '**/*.csproj'
    
        - task: DotNetCoreCLI@2
          displayName: 'Publish the project - $(buildConfiguration)'
          inputs:
            command: 'publish'
            projects: '**/*.csproj'
            publishWebProjects: false
            arguments: '--no-build --configuration $(buildConfiguration) --output $(Build.ArtifactStagingDirectory)/$(buildConfiguration)'
            zipAfterPublish: true
    
        - publish: '$(Build.ArtifactStagingDirectory)'
          artifact: drop
    
    - stage: 'Dev'
      displayName: 'Deploy to the dev environment'
      dependsOn: Build
      condition:  succeeded()
      jobs:
      - deployment: Deploy
        pool:
          vmImage: 'ubuntu-22.04'
        environment: dev
        variables:
        - group: Release
        strategy:
          runOnce:
            deploy:
              steps:
              - download: current
                artifact: drop
              - task: AzureWebApp@1
                displayName: 'Azure App Service Deploy: dev website'
                inputs:
                  azureSubscription: 'your-subscription'
                  appType: 'webAppLinux'
                  appName: '$(WebAppNameDev)'
                  package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip'
    
    - stage: 'Staging'
      displayName: 'Deploy to the staging environment'
      dependsOn: Dev
      jobs:
      - deployment: Deploy
        pool:
          vmImage: 'ubuntu-22.04'
        environment: staging
        variables:
        - group: 'Release'
        strategy:
          runOnce:
            deploy:
              steps:
              - download: current
                artifact: drop
              - task: AzureWebApp@1
                displayName: 'Azure App Service Deploy: staging website'
                inputs:
                  azureSubscription: 'your-subscription'
                  appType: 'webAppLinux'
                  appName: '$(WebAppNameStaging)'
                  package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip'
    
  2. Altere a tarefa AzureWebApp@1 na fase de Preparo para usar sua assinatura.

    1. Selecione Configurações para a tarefa.

      Captura de tela da opção de configurações na tarefa do editor YAML.

    2. Atualize o valor your-subscription da Assinatura do Azure para usar sua própria assinatura. Talvez seja necessário autorizar o acesso como parte desse processo.

      Captura de tela do item de menu da assinatura do Azure.

    3. Defina o Tipo de aplicativo como Aplicativo Web no Linux.

    4. Selecione Adicionar para atualizar a tarefa.

  3. Vá para a execução do pipeline. Acompanhe a compilação enquanto ela é executada. Quando ele atinge Staging, o pipeline aguarda a aprovação manual da liberação. Você também receberá um email informando que tem um pipeline pendente de aprovação.

    Captura de tela da espera pela aprovação do pipeline.

  4. Revise a aprovação e permita a execução do pipeline.

    Captura de tela da verificação de validação manual.

Limpar os recursos

Se você não quiser continuar a usar esse aplicativo, exclua o grupo de recursos no portal do Azure e o projeto no Azure DevOps com as seguintes etapas:

Para limpar o grupo de recursos:

  1. Acesse o portal do Azure e entre.

  2. Na barra de menus, selecione Cloud Shell. Quando solicitado, escolha a experiência do Bash.

    Uma captura de tela do portal do Azure mostrando a seleção do item de menu Cloud Shell.

  3. Execute o comando az group delete a seguir para excluir o grupo de recursos que você usou, tailspin-space-game-rg.

    az group delete --name tailspin-space-game-rg
    

Para excluir seu projeto do Azure DevOps, incluindo o pipeline de build, confira Excluir projeto.