Compartilhar via


Início Rápido: Criar e implantar um aplicativo Web Python do GitHub Codespaces no Azure usando um modelo da CLI do Desenvolvedor do Azure

Este guia de início rápido orienta você pela maneira mais fácil e rápida de criar e implantar uma solução web e de banco de dados python no Azure. Ao seguir as instruções neste guia de início rápido, você:

  • Escolha um modelo da CLI do Desenvolvedor do Azure (azd) com base na estrutura web do Python, na plataforma de banco de dados do Azure e na plataforma de hospedagem da Web do Azure na qual você deseja criar.
  • Crie um novo Codespace do GitHub contendo o código gerado a partir do azd modelo selecionado.
  • Use os Codespaces do GitHub e o terminal bash online do Visual Studio Code. O terminal permite que você use comandos da CLI do Desenvolvedor do Azure para executar um azd modelo para criar um aplicativo Web e um banco de dados de exemplo e criar e configurar os recursos necessários do Azure e, em seguida, implantar o aplicativo Web de exemplo no Azure.
  • Edite o aplicativo Web em um Codespace do GitHub e use um azd comando para reimplantar.
  • Use um azd comando para limpar os recursos do Azure.
  • Feche e reabra seu Codespace do GitHub.
  • Publique seu novo código em um repositório GitHub.

Deve levar menos de 25 minutos para concluir este tutorial. Após a conclusão, você pode começar a modificar o novo projeto com seu código personalizado.

Para saber mais sobre esses azd modelos para o desenvolvimento de aplicativos Web Python:

Pré-requisitos

Importante

Os Codespaces do GitHub e o Azure são serviços pagos baseados em assinatura. Após algumas alocações gratuitas, você poderá ser cobrado pelo uso desses serviços. Seguir este guia de início rápido pode afetar essas alocações ou a cobrança. Quando possível, os azd modelos foram criados usando a camada de opções mais barata, mas alguns podem não ser gratuitos. Use a calculadora de preços do Azure para entender melhor os custos. Para obter mais informações, consulte os preços dos Codespaces do GitHub para obter mais detalhes.

Escolher um modelo e criar um codespace

Escolha um azd modelo com base na estrutura web do Python, na plataforma de hospedagem da Web do Azure e na plataforma de banco de dados do Azure na qual você deseja criar.

  1. Na lista a seguir de modelos, escolha um que use as tecnologias que você deseja usar em seu novo aplicativo Web.

    Modelo Estrutura Web Base de dados Plataforma de hospedagem Novo espaço de códigos
    azure-django-postgres-flexible-aca Django Servidor Flexível do PostgreSQL Aplicativos de Contêiner do Azure Novo Codespace
    azure-django-postgres-flexible-appservice Django Servidor Flexível do PostgreSQL Serviço de aplicativo do Azure Novo Codespace
    azure-django-cosmos-postgres-aca Django Cosmos DB (Adaptador PostgreSQL) Aplicativos de Contêiner do Azure Novo Codespace
    azure-django-cosmos-postgres-appservice Django Cosmos DB (Adaptador PostgreSQL) Serviço de aplicativo do Azure Novo Codespace
    azure-django-postgres-addon-aca Django Complemento PostgreSQL dos Aplicativos de Contêiner do Azure Aplicativos de Contêiner do Azure Novo Codespace

  1. Para sua conveniência, a última coluna de cada tabela contém um link que cria um novo Codespace e inicializa o azd modelo em sua conta do GitHub. Clique com o botão direito do mouse e selecione "Abrir em nova guia" no link "Novo Codespace" ao lado do nome do modelo selecionado para iniciar o processo de instalação.

    Durante esse processo, você pode ser solicitado a fazer logon em sua conta do GitHub e é solicitado que você confirme se deseja criar o Codespace. Selecione o botão "Criar Codespace" para ver a página "Configurando seu codespace".

  2. Depois de alguns minutos, uma versão baseada na Web do Visual Studio Code é carregada em uma nova guia do navegador com o modelo Web em Python carregado como um espaço de trabalho na exibição Explorer.

Autenticar no Azure e implantar o modelo azd

Agora que você tem um Codespace do GitHub contendo o código recém-gerado, use o azd utilitário de dentro do Codespace para publicar o código no Azure.

  1. No Visual Studio Code baseado na Web, o terminal deve ser aberto por padrão. Se não for o caso, use a tecla til ~ para abrir o terminal. Além disso, por padrão, o terminal deve ser um terminal bash. Se não estiver, altere para bash na área superior direita da janela do terminal.

  2. No terminal bash, insira o seguinte comando:

    azd auth login
    

    azd auth login inicia o processo de autenticação do codespace para sua conta do Azure.

    Start by copying the next code: XXXXXXXXX
    Then press enter and continue to log in from your browser...
    
    Waiting for you to complete authentication in the browser...
    
  3. Siga as instruções, que incluem:

    • Copiando um código gerado
    • Selecionar inserir para abrir uma nova guia do navegador e colar o código na caixa de texto
    • Escolhendo sua conta do Azure em uma lista
    • Confirmando que você está tentando entrar na CLI do Microsoft Azure
  4. Quando bem-sucedida, a seguinte mensagem é exibida de volta na guia Codespaces no terminal:

    Device code authentication completed.
    Logged in to Azure.
    
  5. Implante seu novo aplicativo no Azure inserindo o seguinte comando:

    azd up
    

    Durante esse processo, você será solicitado a:

    • Insira um novo nome do ambiente
    • Selecione uma Assinatura do Azure para usar [Usar setas para mover, digitar para filtrar]
    • Selecione um local do Azure a ser usado: [Usar setas para mover, digitar para filtrar]

    Depois de responder a essas perguntas, a saída de azd indica que a implantação está progredindo.

    Importante

    Depois de azd up concluído com êxito, o aplicativo Web de exemplo estará disponível na Internet pública e sua Assinatura do Azure começará a acumular encargos para todos os recursos criados. Os criadores dos azd modelos escolheram intencionalmente camadas baratas, mas não necessariamente camadas gratuitas , pois as camadas gratuitas geralmente têm disponibilidade restrita. Depois de terminar de trabalhar com o aplicativo Web de exemplo, use azd down para remover todos os serviços que foram criados por azd up.

    Siga as instruções quando solicitado a escolher a Assinatura do Azure a ser usada para pagamento e selecione um local do Azure a ser usado. Escolha uma região próxima a você geograficamente.

    A execução azd up pode levar vários minutos, pois está provisionando e implantando vários serviços do Azure. À medida que o progresso é exibido, observe os erros. Se você vir erros, consulte a seção Solução de problemas na parte inferior deste documento.

  6. Quando azd up é concluído, uma saída semelhante é exibida:

    (✓) Done: Deploying service web
    - Endpoint: https://xxxxx-xxxxxxxxxxxxx-ca.example-xxxxxxxx.westus.azurecontainerapps.io/
    
    SUCCESS: Your application was provisioned and deployed to Azure in 11 minutes 44 seconds.
    You can view the resources created under the resource group xxxxx-rg in Azure Portal:
    https://portal.azure.com/#@/resource/subscriptions/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx/resourceGroups/xxxxx-rg/overview
    

    Se você vir uma tela padrão ou uma tela de erro, o aplicativo talvez esteja iniciando. Aguarde de 5 a 10 minutos para ver se o problema se resolve antes de solucionar problemas.

    Ctrl + clique na primeira URL após a palavra - Endpoint: para ver o projeto de aplicativo Web de exemplo em execução no Azure.

  7. Ctrl + clique na segunda URL da etapa anterior para exibir os recursos provisionados no portal do Azure.

Editar e reimplantar

A próxima etapa é fazer uma pequena alteração no aplicativo Web e reimplantar.

  1. Retorne à guia do navegador que contém o Visual Studio Code e use o modo de exibição Explorer do Visual Studio Code para navegar até a pasta src/templates e abrir o arquivo index.html . Localize a seguinte linha de código:

    <h1 id="page-title">Welcome to ReleCloud</h1>
    

    Altere o texto dentro do H1:

    <h1 id="page-title">Welcome to ReleCloud - UPDATED</h1>
    

    Seu código é salvo conforme você digita.

  2. Para reimplantar o aplicativo com sua alteração, execute o seguinte comando no terminal:

    azd deploy
    
  3. Depois que o comando for concluído, atualize a guia do navegador com o site do ReleCloud para visualizar as atualizações. Dependendo da plataforma de hospedagem da Web que está sendo usada, pode levar vários minutos até que suas alterações fiquem visíveis.

    Agora você está pronto para editar e excluir arquivos no modelo. Para obter mais informações, consulte o que posso editar ou excluir no modelo?

Limpar os recursos

Limpe os recursos criados pelo modelo executando o comando azd down .

azd down

O azd down comando exclui os recursos do Azure e o fluxo de trabalho do GitHub Actions. Quando solicitado, concorde em excluir todos os recursos associados ao grupo de recursos.

Opcional: localizar seu codespace

Esta seção demonstra como seu código está (temporariamente) em execução e persistiu a curto prazo em um Codespace. Se você planeja continuar trabalhando no código, deve publicar o código em um novo repositório.

  1. Feche todas as guias relacionadas a este artigo de início rápido ou feche totalmente o navegador.

  2. Abra o navegador e uma nova guia, e navegue até: https://github.com/codespaces

  3. Perto da parte inferior, você verá uma lista de codespaces recentes. Procure o que você criou em uma seção intitulada "Pertencente a Azure-Samples".

  4. Selecione os três pontinhos à direita deste Codespace para visualizar um menu de contexto. A partir daqui, você pode renomear o codespace, publicar em um novo repositório, alterar o tipo de computador, parar o codespace e muito mais.

Opcional: publicar um repositório github de codespaces

Neste ponto, você tem um Codespace, que é um contêiner hospedado pelo GitHub executando seu ambiente de desenvolvimento do Visual Studio Code com seu novo código gerado a partir de um azd modelo. No entanto, o código não é armazenado em um repositório GitHub. Se você planeja continuar trabalhando no código, você deve fazer disso uma prioridade.

  1. No menu de contexto do codespace, selecione "Publicar em um novo repositório".
  2. Na caixa de diálogo "Publicar em um novo repositório", renomeie seu novo repositório e escolha se deseja que ele seja um repositório público ou privado. Selecione "Criar repositório".
  3. Após alguns instantes, o repositório será criado e o código gerado anteriormente neste Início Rápido será enviado por push para o novo repositório. Selecione o botão "Ver repositório" para navegar até o novo repositório.
  4. Para reabrir e continuar editando o código, selecione o menu suspenso verde "<> Code", mude para a guia Codespaces e selecione o nome do Codespaces no qual você estava trabalhando anteriormente. Agora você deve ser retornado ao seu ambiente de desenvolvimento do Visual Studio Code do Codespace.
  5. Use o painel Controle de Origem para criar novas ramificações e preparar e confirmar novas alterações no código.

Resolução de problemas

Se você vir erros durante azd up, tente o seguinte:

  • Execute azd down para remover todos os recursos que possam ter sido criados. Como alternativa, você pode excluir o grupo de recursos que foi criado no portal do Azure.
  • Vá para a página Codespaces da sua conta do GitHub, localize o Codespace criado durante este Início Rápido, selecione o ícone de reticências à direita e escolha "Excluir" no menu de contexto.
  • No portal do Azure, pesquise Cofres de Chaves. Selecione a opção Gerenciar cofres excluídos, escolha sua assinatura, selecione todos os cofres de chaves que contêm o nome azdtest ou o nome que você deu ao seu ambiente, e selecione Purgar.
  • Tente novamente as etapas neste guia de início rápido. Desta vez, quando solicitado, escolha um nome mais simples para seu ambiente. Tente um nome curto, letras minúsculas, sem números, sem letras maiúsculas, sem caracteres especiais.
  • Ao tentar novamente as etapas de início rápido, escolha um local diferente.

Consulte as perguntas frequentes para obter uma lista mais abrangente de possíveis problemas e soluções.