Exercício – Configurar seu ambiente do Azure DevOps

• 15 minutos

Nesta seção, você verificará se a sua organização do Azure DevOps está preparada para concluir o restante deste módulo. Você também cria os ambientes do Serviço de Aplicativo do Azure que serão implantados.

Para realizar essas tarefas:

Adicionar um usuário ao Azure DevOps

Você deve ter uma assinatura do Azure própria para concluir este módulo. Comece a usar o Azure gratuitamente.

Apesar de não precisar ter uma assinatura do Azure para trabalhar com o Azure DevOps, aqui você o usará para implantar nos recursos que existem na sua assinatura do Azure. Para simplificar o processo, entre na sua assinatura do Azure e na sua organização do Azure DevOps na mesma conta Microsoft.

Se você usar contas Microsoft diferentes para entrar no Azure e no Azure DevOps, adicione um usuário à sua organização do DevOps na conta Microsoft usada para entrar no Azure. Para obter mais informações, confira Adicionar usuários à sua organização ou projeto. Ao adicionar o usuário, escolha o nível de acesso Basic.

Depois, saia do Azure DevOps. Entre novamente com a conta Microsoft usada para entrar na assinatura do Azure.

Obter o projeto do Azure DevOps

Aqui, você verificará se a sua organização do Azure DevOps está preparada para concluir o restante deste módulo. Você realiza essa tarefa executando um modelo que cria um projeto no Azure DevOps.

Os módulos deste roteiro de aprendizagem formam uma progressão enquanto você segue a equipe da Tailspin ao longo do percurso de DevOps. Para fins de aprendizado, cada módulo tem um projeto do Azure DevOps associado.

Executar o modelo

Execute um modelo que configura tudo na sua organização do Azure DevOps.

No site do Azure DevOps Demo Generator, execute estas etapas para executar o modelo:

1. Selecione Sign In e aceite os termos de uso.

2. Na página Create New Project, selecione a sua organização do Azure DevOps. Em seguida, insira um nome de projeto, como Space Game – Web – Testes funcionais.

   

3. Selecione Yes, I want to fork this repository. E selecione Authorize.

4. Selecione Create Project.

   O modelo leva alguns minutos para ser executado.

5. Selecione Navigate to project para acessar o seu projeto no Azure DevOps.

Definir a visibilidade do projeto

Inicialmente, o fork do repositório Space Game no GitHub é definido como público, ao passo que o projeto criado pelo modelo do Azure DevOps é definido como privado. Um repositório público no GitHub pode ser acessado por qualquer pessoa, enquanto um repositório privado só é acessível para você e para as pessoas com quem você escolhe compartilhá-lo. Da mesma forma, no Azure DevOps, os projetos públicos fornecem acesso somente leitura a usuários não autenticados, enquanto projetos privados exigem que os usuários tenham acesso e sejam autenticados para acessar os serviços.

No momento, não é necessário modificar nenhuma dessas configurações para os fins deste módulo. No entanto, em seus projetos pessoais, você precisa determinar a visibilidade e o acesso que deseja permitir às outras pessoas. Por exemplo, se o projeto for de código aberto, você poderá optar por tornar o repositório GitHub e o projeto do Azure DevOps públicos. Se o projeto for proprietário, normalmente, você tornará o repositório GitHub e o projeto do Azure DevOps privados.

Mais adiante você poderá se interessar pelos seguintes recursos para determinar qual opção é melhor para seu projeto:

• Usar projetos públicos e privados
• Guia de Início Rápido: Tornar público seu projeto privado
• Definir a visibilidade do repositório

Mover o item de trabalho para Executando

Nesta parte, você atribuirá a si mesmo um item de trabalho no Azure Boards relacionado a este módulo. Você também move o item de trabalho para o estado Doing. Na prática, sua equipe criaria itens de trabalho no início de cada sprint ou iteração de trabalho.

A atribuição de trabalho dessa maneira gera uma lista de verificação para seu uso. Isso dá à sua equipe visibilidade sobre no que você está trabalhando e de quanto trabalho resta fazer. Ele também ajuda a equipe a impor os limites do WIP (trabalho em andamento) para evitar o excesso de trabalho simultâneo.

Lembre-se de que a equipe concordou que estes são os principais problemas do sprint atual:

Aqui você move o terceiro item, Automate quality tests, para a coluna Doing. Em seguida, atribua a si mesmo o item de trabalho. Automate quality tests relacionados à automatização de testes de interface do usuário para o site do Space Game.

Para configurar o item de trabalho:

1. No Azure DevOps, acesse Boards e selecione Boards no menu.

   

2. No item de trabalho Automate quality tests, selecione a seta para baixo na parte inferior do cartão. Em seguida, atribua o item de trabalho a si mesmo.

   

3. Mova o item de trabalho da coluna To Do para a coluna Doing.

   

No final deste módulo, após concluir a tarefa, você moverá o cartão para a coluna Done.

Configurar o projeto localmente

Aqui, você vai carregar o projeto Space Game no Visual Studio Code, configurar o Git, clonar o seu repositório localmente e definir o repositório remoto upstream para baixar o código inicial.

Abrir o terminal integrado

O Visual Studio Code é fornecido com um terminal integrado. Aqui, você pode editar arquivos e trabalhar na linha de comando.

1. Inicie o Visual Studio Code.

2. No menu Exibir, selecione Terminal.

3. Na lista suspensa, selecione Git Bash. Se você estiver familiarizado com outro shell do Unix que prefira usar, selecione-o.

   

   Na janela do terminal, você pode escolher qualquer shell que esteja instalado no sistema. Por exemplo, você pode escolher o Git Bash, o PowerShell ou outro shell.

   Aqui você usará o Git Bash, que faz parte do Git para Windows; assim será mais fácil executar comandos do Git.

   Observação

   No Windows, se você não vir o Git Bash listado como uma opção, verifique se instalou o Git e reinicie o Visual Studio Code.

4. Execute o comando cd para acessar o diretório em que deseja trabalhar. Escolha o diretório base (~) ou outro diretório se desejar.

   cd ~
   

Configurar o Git

Se você estiver usando o Git e o GitHub pela primeira vez, precisará primeiro executar alguns comandos para associar a sua identidade ao Git e se autenticar no GitHub. Para obter mais informações, confira Configurar o Git.

No mínimo, você precisará concluir as etapas a seguir. Execute os comandos no terminal integrado.

1. Defina o seu nome de usuário.
2. Defina seu endereço de email de commit.
3. Armazene em cache a sua senha do GitHub.

Configurar seu projeto no Visual Studio Code

No roteiro de aprendizagem Crie aplicativos com o Azure DevOps, você criou um fork de um repositório Git e clonou-o. O repositório contém o código-fonte do site do Space Game. O fork foi conectado aos seus projetos no Azure DevOps para que o build seja executado quando você efetuar push das alterações para o GitHub.

Nesta parte, você clonará o fork localmente para que seja possível fazer alterações e criar a sua configuração de pipeline.

Clonar o fork localmente

Agora você tem uma cópia do projeto Web Space Game em sua conta do GitHub. Agora, você baixará ou clonará uma cópia no computador para trabalhar com ela.

Um clone, assim como um fork, é uma cópia de um repositório. Ao clonar um repositório, você pode fazer alterações, verificar se elas funcionam conforme o esperado e carregá-las novamente no GitHub. Você também pode sincronizar a cópia local com as alterações feitas por outros usuários autenticados na cópia do GitHub do repositório.

Para clonar o projeto Web Space Game no computador:

1. Acesse o fork do projeto Web do Space Game (mslearn-tailspin-spacegame-web-deploy) no GitHub.

2. Selecione Código. Em seguida, na guia HTTPS, clique no botão ao lado da URL mostrada a fim de copiá-la para a área de transferência.

   

3. No Visual Studio Code, acesse a janela do terminal.

4. No terminal, acesse o diretório em que deseja trabalhar. Escolha o diretório base (~) ou outro diretório se desejar.

   cd ~
   

5. Execute o comando git clone. Substitua a URL mostrada aqui pelo conteúdo da área de transferência:

   git clone https://github.com/your-name/mslearn-tailspin-spacegame-web-deploy.git
   

6. Acesse o diretório mslearn-tailspin-spacegame-web-deploy. Esse é o diretório raiz do repositório.

   cd mslearn-tailspin-spacegame-web-deploy
   

Definir o repositório remoto upstream

Um repositório remoto é um repositório Git no qual os membros da equipe colaboram (como um repositório no GitHub). Aqui você lista seus repositórios remotos e adiciona um que aponte para a cópia do repositório da Microsoft, a fim de obter o exemplo de código mais recente.

1. Execute este comando git remote para listar os seus repositórios remotos:

   git remote -v
   

   Você verá que tem acesso de fetch (download) e push (upload) ao repositório:

   origin  https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (fetch)
   origin  https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (push)
   

   Origem especifica o repositório no GitHub. Ao criar um fork do código de outro repositório, o repositório remoto original (aquele que é a origem do fork) costuma ser chamado upstream.

2. Execute este comando git remote add para criar um repositório remoto chamado upstream que aponta para o repositório da Microsoft:

   git remote add upstream https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web-deploy.git
   

3. Execute git remote novamente para ver as alterações:

   git remote -v
   

   Você verá que ainda têm acesso de fetch (download) e de push (upload) ao repositório. Agora você também tem acesso de fetch no repositório da Microsoft:

   origin  https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (fetch)
   origin  https://github.com/username/mslearn-tailspin-spacegame-web-deploy.git (push)
   upstream        https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web-deploy.git (fetch)
   

Abrir o projeto no Explorador de Arquivos

No Visual Studio Code, a janela do terminal aponta para o diretório raiz do projeto Web Space Game. Para exibir a estrutura dele e trabalhar com arquivos, no Explorador de Arquivos, agora você abrirá o projeto.

1. A maneira mais fácil de abrir o projeto é reabrir o Visual Studio Code no diretório atual. Para fazer isso, execute o seguinte comando no terminal integrado:

   code -r .
   

   Você verá a árvore de diretórios e arquivos no Explorador de Arquivos.

2. Reabra o terminal integrado. O terminal coloca você na raiz do seu projeto Web.

Se o comando code falhar, você precisará adicionar o Visual Studio Code ao PATH do sistema. Para fazer isso:

1. No Visual Studio Code, selecione F1 ou Exibir>Paleta de Comandos para acessar a paleta de comandos.
2. Na paleta de comandos, insira Shell Command: Install 'code' command in PATH.
3. Repita o procedimento anterior para abrir o projeto no Explorador de Arquivos.

Agora você está preparado para trabalhar com o código-fonte do Space Game e a sua configuração do Azure Pipelines no ambiente de desenvolvimento local.

Criar os ambientes do Serviço de Aplicativo do Azure

Aqui, você cria os ambientes que definem as fases do pipeline. Você cria uma instância do Serviço de Aplicativo que corresponde a cada fase: Desenvolvimento, Teste e Preparo.

No módulo Criar um pipeline de várias fases usando o Azure Pipelines, você usou a CLI do Azure para criar as instâncias do Serviço de Aplicativo. Aqui, você fará o mesmo.

Ativar o Cloud Shell por meio do portal do Azure

1. Acesse o portal do Azure e entre.
2. Na barra de menus, selecione Cloud Shell. Quando solicitado, selecione a experiência Bash.

Selecionar uma região do Azure

Aqui, você especifica a região padrão ou a localização geográfica em que os recursos do Azure devem ser criados.

1. No Cloud Shell, execute o comando az account list-locations a seguir para listar as regiões que estão disponíveis na sua assinatura do Azure.

   az account list-locations \
     --query "[].{Name: name, DisplayName: displayName}" \
     --output table
   

2. Na coluna Nome na saída, escolha uma região perto de você. Por exemplo, escolha eastasia ou westus2.

3. Execute az configure para definir a região padrão. Substitua <REGIÃO> pelo nome da região que você escolheu.

   az configure --defaults location=<REGION>
   

   Veja abaixo um exemplo que define westus2 como a região padrão:

   az configure --defaults location=westus2
   

Criar as instâncias do Serviço de Aplicativo

Aqui, você criará as instâncias do Serviço de Aplicativo nas três fases que serão implantadas: Desenvolvimento, Teste e Preparo.

1. No Cloud Shell, gere um número aleatório que torne exclusivo o nome de domínio do seu aplicativo Web.

   webappsuffix=$RANDOM
   

2. Execute o comando az group create a seguir para criar um grupo de recursos chamado tailspin-space-game-rg.

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

3. Execute o comando az appservice plan create a seguir para criar um Plano do Serviço de Aplicativo chamado tailspin-space-game-asp.

   az appservice plan create \
     --name tailspin-space-game-asp \
     --resource-group tailspin-space-game-rg \
     --sku B1 \
     --is-linux
   

   O argumento --sku especifica o plano B1, que é executado no nível Básico. O argumento --is-linux especifica o uso de trabalhadores do Linux.

   Importante

   Se o SKU B1 não fizer parte da sua assinatura do Azure, escolha outro plano, como S1 (Standard).

4. Execute os seguintes comandos az webapp create para criar as três instâncias do Serviço de Aplicativo, uma para cada um dos ambientes: Desenvolvimento, Teste e Preparo.

   az webapp create \
     --name tailspin-space-game-web-dev-$webappsuffix \
     --resource-group tailspin-space-game-rg \
     --plan tailspin-space-game-asp \
     --runtime "DOTNET|6.0"
   
   az webapp create \
     --name tailspin-space-game-web-test-$webappsuffix \
     --resource-group tailspin-space-game-rg \
     --plan tailspin-space-game-asp \
     --runtime "DOTNET|6.0"
   
   az webapp create \
     --name tailspin-space-game-web-staging-$webappsuffix \
     --resource-group tailspin-space-game-rg \
     --plan tailspin-space-game-asp \
     --runtime "DOTNET|6.0"
   

   Para fins de aprendizado, aqui você aplica o mesmo plano do Serviço de Aplicativo, (B1 Básico), a cada instância do Serviço de Aplicativo. Na prática, você atribuiria um plano que corresponde à carga de trabalho esperada.

5. Execute o comando az webapp list a seguir para listar o nome do host e o estado de cada instância do Serviço de Aplicativo.

   az webapp list \
     --resource-group tailspin-space-game-rg \
     --query "[].{hostName: defaultHostName, state: state}" \
     --output table
   

   Anote o nome do host de cada serviço em execução. Você precisará desses nomes de host mais tarde quando verificar o trabalho. Veja um exemplo:

   HostName                                                 State
   -------------------------------------------------------  -------
   tailspin-space-game-web-dev-21017.azurewebsites.net      Running
   tailspin-space-game-web-test-21017.azurewebsites.net     Running
   tailspin-space-game-web-staging-21017.azurewebsites.net  Running
   

6. Como etapa opcional, copie e cole um ou mais nomes no navegador para verificar se eles estão em execução e se a home page padrão é exibida.

   Você deverá ver a seguinte página:

   

Criar variáveis de pipeline no Azure Pipelines

Em Criar um pipeline de várias fases usando o Azure Pipelines, você adicionou uma variável para cada uma das instâncias do Serviço de Aplicativo, que correspondem às fases de Desenvolvimento, de Teste e de Preparo no seu pipeline. Aqui, você fará o mesmo.

Cada fase na sua configuração de pipeline usa essas variáveis para identificar em qual instância do Serviço de Aplicativo ele deve ser implantado.

Para adicionar as variáveis:

1. No Azure DevOps, acesse o seu projeto Space Game – Web – Testes funcionais.

2. Em Pipelines, selecione Library.

   

3. Selecione + Variable group.

4. Em Properties, no nome do grupo de variáveis, insira Release.

5. Em Variables, selecione + Add.

6. Para o nome da variável, insira WebAppNameDev. No valor da variável, insira o nome da instância do Serviço de Aplicativo que corresponde ao seu ambiente de Desenvolvimento, como tailspin-space-game-web-dev-1234.

7. Repita as etapas 5 e 6 mais duas vezes para criar variáveis para os seus ambientes de Teste e de Preparo, conforme mostrado nesta tabela:

   Nome da variável	Valor de exemplo
   WebAppNameTest	tailspin-space-game-web-test-1234
   WebAppNameStaging	tailspin-space-game-web-staging-1234

   Verifique se cada valor de exemplo foi substituído pela instância do Serviço de Aplicativo que corresponde ao seu ambiente.

   Importante

   Defina o nome da instância do Serviço de Aplicativo, não o nome do host. Neste exemplo, insira tailspin-space-game-web-dev-1234, não tailspin-space-game-web-dev-1234.azurewebsites.net.

8. Próximo à parte superior da página, selecione Save para salvar a sua variável no pipeline.

   Seu grupo de variáveis deve ser semelhante a este:

   

Criar os ambientes de desenvolvimento, teste e preparo

Em Criar um pipeline de várias fases usando o Azure Pipelines, você criou ambientes para os ambientes de desenvolvimento, teste e preparo. Aqui, você repete o processo. Desta vez, no entanto, você omite critérios adicionais, como o requisito de aprovação humana, para promover alterações de um estágio para o outro.

Para criar os ambientes de desenvolvimento, teste e preparo:

1. No Azure Pipelines, selecione Environments.

   

2. Para criar o ambiente de desenvolvimento:

   1. Selecione Criar ambiente.
   2. Em Nome, insira desenvolvimento.
   3. Deixe os outros campos com suas definições padrão.
   4. Selecione Criar.

3. Para criar o ambiente de teste:

   1. Retorne à página Ambientes.
   2. Selecione Novo ambiente.
   3. Em Nome, insira teste.
   4. Selecione Criar.

4. Para criar o ambiente de preparo:

   1. Retorne à página Ambientes.
   2. Selecione Novo ambiente.
   3. Em Name, insira preparo.
   4. Selecione Criar.

Criar uma conexão de serviço

Aqui, você criará uma conexão de serviço que permite que o Azure Pipelines acesse sua assinatura do Azure. O Azure Pipelines usa essa conexão de serviço para implantar o site no Serviço de Aplicativo. Você criou uma conexão de serviço semelhante no módulo anterior.

1. No Azure DevOps, acesse o seu projeto Space Game – Web – Testes funcionais.

2. No canto inferior da página, selecione Project settings.

3. Em Pipelines, selecione Conexões de serviço.

4. Selecione New service connection, Azure Resource Manager e Next.

5. Próximo à parte superior da página, Service principal (automatic). Em seguida, selecione Avançar.

6. Preencha estes campos:

   Campo	Valor
   Scope level	Assinatura
   Subscription	Sua assinatura do Azure
   Grupo de recursos	tailspin-space-game-rg
   Service connection name	Resource Manager – Tailspin – Space Game

   Durante o processo, talvez você precise entrar na sua conta Microsoft.

7. Verifique se a opção Grant access permission to all pipelines está selecionada.

8. Selecione Salvar.

   O Azure DevOps executa uma conexão de teste para verificar se ele consegue se conectar à sua assinatura do Azure. Se o Azure DevOps não conseguir se conectar, você terá a oportunidade de entrar uma segunda vez.