Nem todo mundo sabe quanto o Azure DevOps é poderoso em relação à quantidade de tecnologias suportadas. Um bom exemplo disso é o suporte ao framework Node.js.

Neste artigo, trataremos de tarefas rotineiras sobre a administração
Azure, como:

  • Criar um novo projeto no Azure DevOps;
  • Criar uma definição de Build;
  • Criar uma aplicação Node.js em branco no Azure;
  • Criar um Release no Azure DevOps para sua aplicação diretamente no Azure.

Se você já domina algum dos temas acima, sinta-se livre para pular para a etapa que mais interessa e não se esqueça de deixar um feedback nos comentários.

Clone a aplicação Node.js

Para começar, precisamos ter uma aplicação Node.js e já cuidamos disso para você. Basta fazer um clone da aplicação neste link diretamente do GitHub.

Use o comando abaixo para fazer isso:

git clone https://github.com/rafaelmbs/node-xml2js

Criação do projeto no Azure DevOps

O próximo passo (criar um projeto no ambiente Azure DevOps) é uma tarefa intuitiva. Ao iniciar sua sessão no Azure, você terá acesso aos seus projetos. Clique no campo superior direito em + Create project e preencha os dados, como na imagem abaixo:

Página de criação de um novo projeto no Azure DevOps.
Página de criação de um novo projeto no Azure DevOps

É possível expandir a opção Advanced e ter acesso a opções customizadas quanto ao sistema de controle de versões de código como o Git ou o Team Foundation Version Control.

Opções avançadas para a criação do novo projeto.
Opções avançadas para a criação do novo projeto

Após criar o projeto, você será redirecionado à página Project Overview, onde poderá administrar o projeto, permissões e também acessar o repositório Git para assim copiar a URL, como demonstrado abaixo:

Página Overview do projeto.
Página Overview do projeto
Aba onde podem ser vistos os dados do repositório do projeto.
Aba onde podem ser vistos os dados do repositório do projeto

Com a URL, vá até o repositório local onde você fez o clone do GitHub e adicione o repositório remoto com o seguinte comando:

git remote add azure-devops   https://rafaelmbs.visualstudio.com/DefaultCollection/WeatherAPI/_git/WeatherAPI

Depois, execute os comandos abaixo:

git remote
git push azure-devops master

O git remote irá mostrar se conseguiu adicionar o repositório remoto e o git push azure-devops enviará seu código-fonte para o repositório no Azure DevOps. Para isso, é necessário criar as devidas permissões.

Criação do Build

Nesta mesma página, você encontrará a opção Set up build. Clique nela para criar uma nova definição de compilação online. Eis o CI:

Set up build.

Com a busca, encontre o template NodeJS With Gulp. Clique em Apply para ser redirecionado para a próxima etapa.

Próxima etapa.

Selecione a opção Hosted VS2017 em Default agend queue.

Note que há vários processos durante o Build. Vamos fazer uma breve descrição de cada um deles:

  • Get sources: nesta opção, podemos selecionar de onde o código-fonte será clonado. É o ponto inicial do Build.
  • npm install: este processo faz a instalação de dependências npm na aplicação.

Graças ao arquivo .gitignore, ao fazer push do fonte pro Azure DevOps, mesmo que você já tenha instalado as dependências e executado a aplicação Node local, a pasta node_modules no Git não será versionada.

.gitignore contendo pasta node_modules.
.gitignore contendo pasta node_modules

Portanto, durante a execução do Build, a tarefa npm install irá instalar novamente os pacotes npm necessários para executar o aplicativo Node, criando assim a pasta node_modules com os pacotes no servidor.

Mas para que isso funcione corretamente, devemos informar ao Build quais pacotes devem ser instalados. Para isso, precisamos ter um arquivo package.json com as dependências que desejamos instalar:

package.json com dependências a instalar com o comando npm install.
package.json com dependências a instalar com o comando npm install

Sem esse arquivo, seria necessário executar o comando npm install para cada pacote, como o primeiro npm install body-parser e também para os outros.

  • Run gulp task: este é o automatizador de tarefas para Build e Deploy;
  • Archive files: cria um pacote com os arquivos de publicação e armazena para a próxima etapa;
  • Copy Publish Artifact: drop: esta tarefa copia os arquivos empacotados e publica na versão do Build.

Clique em Save and Queue e, em seguida, Queue. Após executar o Build Definition, teremos uma nova versão de Build com o padrão de nomenclatura Build 20190405.1, sendo a data seguida de ponto e a versão, da compilação diária.

Irá surgir um banner composto por data, hora e um indicador da versão do Build.

Criação de uma aplicação Node em branco no Azure

Acesse sua conta no portal Azure e as opções App Services, Add. Com a ajuda da busca, encontre o template Node JS Empty Web App.

Informações para a criação de um app service no Azure.
Informações para a criação de um app service no Azure

Criação do Release

Volte à sua conta Azure DevOps. No menu lateral, você encontrará a opção Releases como subitem da opção Pipelines. Selecione-a.

Em Releases, clique em New pipeline e você será redirecionado à opção a seguir:

A opção para a integração com o Azure é Azure App Service Deployment.

Após clicar em Apply, você terá um ambiente de deploy devidamente criado, mas ainda será necessário atribuir uma etapa muito importante, que é a entrega da aplicação ao Azure. Você também precisará configurar a conta do Azure para tal integração. O ambiente Azure DevOps torna essa configuração bastante intuitiva baseada em seu fluxo.

Dá pra notar que há uma task pendente. Clique em 1 job, 1 task.

Após clicar em nessa opção, você será redirecionado à página da etapa de configuração de conta Azure, então será necessário configurar sua conta para que ela esteja integrada com o DevOps. Há uma opção de Manager para adicionar sua assinatura Azure. Em seguida, selecione em qual aplicação você quer fazer o Deploy (a que criamos no Azure).

Na opção do agente de processamento, há um conjunto de configurações em que é possível alterar em tempo de Deploy o arquivo de configurações com variáveis que serão preenchidas apenas na entrega, garantindo a segurança e a integridade dos dados como connection strings.

Em Additional Deployment Options, não se esqueça de selecionar o campo Select deployment method para habilitar as opções Web Deploy e Rename locked files e para que não seja necessário parar a aplicação no Azure por conta de arquivos bloqueados. Clique em Save.

Volte à opção Pipeline para informarmos ao Release Definition de onde iremos buscar os arquivos para o Deploy. Para isso, iremos usar a opção Artifacts. Clique em + Add an artifact:

Selecione o Build que criamos na opção Source (Build Definition) e clique em Add.

Ainda na opção Artfacts, clique em Build. Você poderá habilitar o CD ou o Continuous Deployment, que terá uma trigger para que, cada vez que for criado um Build, seja feita uma publicação:

Selecione a opção Enabled para habilitar o Continuous Deployment e clique em Save.

Agora, com uma definição de entrega, podemos testar clicando na opção +Release, Create release, assim teremos um Popup com o Stage e a versão que queremos enviar para o Deploy. Clique em Create e acompanhe o Release clicando no link criado Release-1, presente no banner:

Deploy aguardando agente.
Deploy aguardando agente
Deploy concluído com êxito.
Deploy concluído com êxito

Teste a aplicação usando este link.

Retorno da aplicação no Postman.
Retorno da aplicação no Postman

Esta foi uma breve publicação sobre como é possível publicar uma aplicação Node.js usando ferramentas Microsoft, como o Azure DevOps, e ter ambos integrados entre si.

Para dúvidas ou sugestões, envie comentários ou entre em contato pelo
e-mail rafael.santos@iteris.com.br.


Entre em contato com a Iteris e saiba como podemos te ajudar a ter a aplicação que você imagina para o seu negócio.