Introdução aos repositórios CodeCatalyst de origem e ao blueprint do aplicativo de página única - Amazon CodeCatalyst

As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá.

Introdução aos repositórios CodeCatalyst de origem e ao blueprint do aplicativo de página única

Siga as etapas deste tutorial para aprender a trabalhar com repositórios de origem na Amazon CodeCatalyst.

A maneira mais rápida de começar a trabalhar com repositórios de origem na Amazon CodeCatalyst é criar um projeto usando um modelo. Quando você cria um projeto usando um modelo, recursos são criados para você, incluindo um repositório de origem que inclui código de amostra. Você pode usar esse exemplo de repositório e código para saber como:

  • Visualizar os repositórios de origem de um projeto e navegar por seus conteúdos

  • Criar um Ambiente de Desenvolvimento com uma nova ramificação onde você pode trabalhar no código

  • Alterar um arquivo, confirmar e enviar suas alterações

  • Criar uma solicitação pull e revisar suas alterações de código com outros membros do projeto

  • Visualizar o fluxo de trabalho do seu projeto, compilar e testar automaticamente as alterações na ramificação de origem da solicitação pull

  • Mesclar suas alterações da ramificação de origem na ramificação de destino e fechar a solicitação pull

  • Ver as alterações mescladas compiladas e implantadas automaticamente

Para aproveitar ao máximo este tutorial, convide outras pessoas para o seu projeto para que vocês possam trabalhar juntos em uma solicitação pull. Você também pode explorar recursos adicionais CodeCatalyst, como criar problemas e associá-los a uma pull request ou configurar notificações e receber alertas quando o fluxo de trabalho associado for executado. Para uma exploração completa de CodeCatalyst, consulteTutoriais de conceitos básicos.

Criar um projeto com um esquema

Criar um projeto é o primeiro passo para poder trabalhar em conjunto. Você pode usar um esquema para criar seu projeto, que também criará um repositório de origem com código de amostra e um fluxo de trabalho que compilará e implantará automaticamente seu código quando você o alterar. Neste tutorial, mostraremos um projeto criado com o esquema aplicação de página única, mas você pode seguir os procedimentos de qualquer projeto com um repositório de origem. Selecione ou adicione um perfil do IAM, se você não tiver um como parte da criação do projeto. Recomendamos que você use o CodeCatalystWorkflowDevelopmentRole-spaceNamefunção de serviço para este projeto.

Se você já tem um projeto, siga para Visualizar os repositórios de um projeto.

nota

Somente usuários com a função de administrador do Space ou usuário avançado podem criar projetos no CodeCatalyst. Se você não tem esse perfil e precisa de um projeto para trabalhar neste tutorial, peça a alguém com um desses perfis que crie um projeto para você e adicione você ao projeto criado. Para obter mais informações, consulte Concessão de acesso com perfis de usuário.

Como criar um projeto com um esquema
  1. No CodeCatalyst console, navegue até o espaço em que você deseja criar um projeto.

  2. No painel do espaço, escolha Criar projeto.

  3. Selecione Começar com um esquema.

    dica

    Você pode optar por adicionar um esquema fornecendo ao Amazon Q os requisitos do projeto para que o Amazon Q sugira um esquema. Para ter mais informações, consulte Usar o Amazon Q para escolher um esquema ao criar um projeto ou adicionar funcionalidade e Práticas recomendadas ao usar o Amazon Q para criar projetos ou adicionar funcionalidades com esquemas. Esse recurso está disponível somente na região do Oeste dos EUA (Oregon).

    Essa funcionalidade exige que recursos de IA generativa estejam habilitados para o espaço. Para ter mais informações, consulte Gerenciar recursos de IA generativa.

  4. Na guia CodeCatalyst Blueprints ou Space blueprints, escolha um blueprint e, em seguida, escolha Avançar.

  5. Em Nomear seu projeto, insira o nome que você deseja atribuir ao seu projeto e os nomes dos recursos associados. O nome deve ser exclusivo em seu espaço.

  6. (Opcional) Por padrão, o código-fonte criado pelo blueprint é armazenado em um CodeCatalyst repositório. Também é possível armazenar o código-fonte do esquema em um repositório de terceiros. Para obter mais informações, consulte Adicione funcionalidade a projetos com extensões no CodeCatalyst.

    Importante

    CodeCatalyst não suporta a detecção de alterações na ramificação padrão para repositórios vinculados. Para alterar a ramificação padrão de um repositório vinculado, você deve primeiro desvinculá-la CodeCatalyst, alterar a ramificação padrão e depois vinculá-la novamente. Para obter mais informações, consulte Vinculando GitHub repositórios, repositórios do Bitbucket, repositórios de GitLab projetos e projetos do Jira no CodeCatalyst.

    Como prática recomendada, sempre verifique se você tem a versão mais recente da extensão antes de vincular um repositório.

    Realize um destes procedimentos, dependendo do provedor de repositório de terceiros que você deseja usar:

    • GitHub repositórios: Conecte uma GitHub conta.

      Escolha o menu suspenso Avançado, escolha GitHub como provedor do repositório e, em seguida, escolha a GitHub conta na qual você deseja armazenar o código-fonte criado pelo blueprint.

      nota

      Se você estiver conectando uma GitHub conta, deverá criar uma conexão pessoal para estabelecer um mapeamento de identidade entre sua CodeCatalyst identidade e sua GitHub identidade. Para ter mais informações, consulte Conexões pessoais e Acessando GitHub recursos com conexões pessoais.

    • Repositórios do Bitbucket: conecte um espaço de trabalho do Bitbucket.

      Escolha o menu suspenso Avançado, selecione Bitbucket como provedor do repositório e, depois, escolha o espaço de trabalho do Bitbucket em que você deseja armazenar o código-fonte criado pelo esquema.

    • GitLab repositórios: Conecte um GitLab usuário.

      Escolha o menu suspenso Avançado, escolha GitLab como provedor do repositório e, em seguida, escolha o GitLab usuário no qual você deseja armazenar o código-fonte criado pelo blueprint.

  7. Em Recursos do projeto, configure os parâmetros do esquema. Dependendo do esquema, você pode ter a opção de nomear o repositório de origem.

  8. (Opcional) Para visualizar arquivos de definição com atualizações com base nas seleções de parâmetros do projeto que você fez, selecione Visualizar código ou Visualizar fluxo de trabalho em Gerar visualização do projeto.

  9. (Opcional) Selecione Visualizar detalhes no cartão do esquema para visualizar detalhes específicos sobre o esquema, como uma visão geral da arquitetura do esquema, conexões e permissões necessárias e o tipo de recursos que o esquema cria.

  10. Escolha Criar projeto.

A página de visão geral do projeto é aberta assim que você cria um projeto ou aceita um convite para um projeto e conclui o processo de login. A página de visão geral do projeto de um novo projeto não contém problemas em aberto nem solicitações pull. Você pode optar por criar um problema e atribuí-lo a si mesmo. Você também pode optar por convidar outra pessoa para o seu projeto. Para ter mais informações, consulte Criando um problema no CodeCatalyst e Convite de um usuário para um projeto.

Visualizar os repositórios de um projeto

Como membro de um projeto, você pode visualizar os repositórios de origem do projeto. Você também pode criar repositórios adicionais. Se alguém com a função de administrador do Space tiver instalado e configurado os GitHub repositórios, os repositórios do Bitbucket ou a extensão dos GitLab repositórios, você também poderá adicionar links para repositórios de terceiros nas GitHub contas, nos espaços de trabalho do Bitbucket ou nos usuários configurados para a extensão. GitLab Para ter mais informações, consulte Criar um repositório de origem e Início rápido: instalação de extensões, conexão de provedores e vinculação de recursos no CodeCatalyst.

nota

Para projetos criados com o blueprint de aplicativo de página única, o nome padrão do repositório de origem que contém o código de amostra é. spa-app

Como navegar até os repositórios de origem de um projeto
  1. Navegue até o projeto e faça o seguinte:

    • Na página de resumo do seu projeto, selecione o repositório que você deseja na lista e, depois, selecione Visualizar repositório.

    • No painel de navegação, selecione Código e, depois, selecione Repositórios de origem. Em Repositórios de origem, selecione o nome do repositório na lista. Você pode filtrar a lista de repositórios digitando parte do nome do repositório na barra de filtro.

  2. Na página inicial do repositório, visualize o conteúdo do repositório e as informações sobre os recursos associados, como o número de solicitações pull e fluxos de trabalho. Por padrão, o conteúdo da ramificação padrão é exibido. Você pode alterar a visualização selecionando uma ramificação diferente na lista suspensa.

A página de visão geral do repositório inclui informações sobre os fluxos de trabalho e solicitações pull configuradas para as ramificações desse repositório e seus arquivos. Se você acabou de criar o projeto, os fluxos de trabalho iniciais para compilar, testar e implantar o código ainda estarão em execução, pois demoram alguns minutos para serem concluídos. Você pode visualizar os fluxos de trabalho relacionados e seus status selecionando o número abaixo de Fluxos de trabalho relacionados, mas isso abre a página Fluxos de trabalho em CI/CD. Para este tutorial, permaneça na página de visão geral e explore o código no repositório. O conteúdo do arquivo README.md é renderizado nesta página abaixo dos arquivos do repositório. Em Arquivos, o conteúdo da ramificação padrão é exibido. Você pode alterar a visualização do arquivo para mostrar o conteúdo de outra ramificação, se você tiver uma. A pasta .codecatalyst contém o código usado para outras partes do projeto, como arquivos YAML do fluxo de trabalho.

Para visualizar o conteúdo das pastas, selecione a seta próxima ao nome da pasta para expandi-la. Por exemplo, selecione a seta ao lado de src para visualizar os arquivos da aplicação web de página única contida nessa pasta. Como visualizar o conteúdo de um arquivo, escolha-o na lista. A opção Visualizar arquivos será aberta, onde você pode navegar pelo conteúdo de vários arquivos. Você também pode editar arquivos únicos no console, mas, para editar vários arquivos, crie um Ambiente de Desenvolvimento.

Criar um Ambiente de Desenvolvimento

Você pode adicionar e alterar arquivos em um repositório de origem no CodeCatalyst console da Amazon. No entanto, para trabalhar de forma eficaz com vários arquivos e ramificações, recomendamos usar um Ambiente de Desenvolvimento ou clonar o repositório em seu computador local. Neste tutorial, criaremos um ambiente de AWS Cloud9 desenvolvimento com uma ramificação chamadadevelop. Você pode escolher um nome de ramificação diferente, mas ao nomear a ramificação develop, um fluxo de trabalho será executado automaticamente para compilar e testar seu código quando você criar uma solicitação pull posteriormente neste tutorial.

dica

Se você decidir clonar um repositório localmente em vez de ou além de usar um Ambiente de Desenvolvimento, assegure-se de ter o Git no computador local ou que seu IDE inclua o Git. Para obter mais informações, consulte Configuração para trabalhar com repositórios de origem.

Para criar um Ambiente de Desenvolvimento com uma nova ramificação
  1. Abra o CodeCatalyst console em https://codecatalyst.aws/.

  2. Navegue até o projeto em que deseja criar um Ambiente de Desenvolvimento.

  3. Selecione o nome do repositório na lista de repositórios de origem do projeto. Como alternativa, no painel de navegação, escolha Código, Repositórios de origem e selecione o repositório para o qual você deseja criar um Ambiente de Desenvolvimento.

  4. Na página inicial do repositório, selecione Criar um ambiente de desenvolvimento.

  5. Selecione um IDE compatível no menu suspenso. Consulte Ambientes de desenvolvimento integrados compatíveis para ambientes de desenvolvimento para obter mais informações.

  6. Escolha o repositório a ser clonado, selecione Trabalhar em uma nova ramificação, insira um nome de ramificação no campo Nome da ramificação e escolha uma ramificação a partir da qual criar a nova ramificação no menu Criar ramificação.

  7. Opcionalmente, adicione um alias para o Ambiente de Desenvolvimento.

  8. Opcionalmente, escolha o botão de edição da configuração do Ambiente de Desenvolvimento para editar a configuração de computação, armazenamento ou tempo limite do Ambiente de Desenvolvimento.

  9. Escolha Criar. Enquanto seu Ambiente de Desenvolvimento estiver sendo criado, a coluna de status do Ambiente de Desenvolvimento exibirá Iniciando e a coluna de status exibirá Executando após a criação do Ambiente de Desenvolvimento. Uma nova guia será aberta com seu ambiente de desenvolvimento no IDE de sua escolha. Você pode editar o código, confirmar e enviar suas alterações.

Depois de criar o Ambiente de Desenvolvimento, você pode editar arquivos, confirmar e enviar suas alterações para a ramificação test. Para este tutorial, edite o conteúdo entre as tags <p> no arquivo App.tsx na pasta src para alterar o texto exibido na página da Web. Comprometa-se e promova sua alteração e, em seguida, retorne à CodeCatalyst guia.

Para fazer e promover uma mudança a partir de um ambiente de AWS Cloud9 desenvolvimento

  1. Em AWS Cloud9, expanda o menu de navegação lateral para navegar pelos arquivos. Expanda src e abra App.tsx.

  2. Faça uma alteração no texto dentro das tags <p>.

  3. Salve o arquivo e, depois, confirme e envie suas alterações usando o menu Git. Como alternativa, na janela do terminal, confirme e envie suas alterações com os comandos git commit e git push.

    git commit -am "Making an example change" git push
    dica

    Talvez seja necessário alterar os diretórios no terminal para o diretório do repositório Git antes de executar com êxito os comandos do Git.

Criar uma solicitação pull

Você pode usar solicitações pull para revisar alterações de código de maneira colaborativa em caso de alterações ou correções relativamente pequenas, adições significativas de recursos ou novas versões do seu software lançado. Neste tutorial, você criará uma pull request para revisar as alterações feitas na test ramificação em comparação com a ramificação principal. Criar uma solicitação pull em um projeto criado com um modelo também iniciará a execução dos fluxos de trabalho associados, se houver.

Para criar uma solicitação pull
  1. Navegue até o projeto.

  2. Execute um destes procedimentos:

    • No painel de navegação, escolha Código, Solicitações pull e, depois, selecione Criar solicitação pull.

    • Na página inicial do repositório, escolha Mais e, depois, selecione Criar solicitação pull.

    • Na página do projeto, selecione Criar solicitação pull.

  3. No Repositório de origem, certifique-se de que o repositório de origem especificado seja aquele que contém o código confirmado. Essa opção só aparece se você não criou a solicitação pull na página principal do repositório.

  4. Em Ramificação de destino, selecione a ramificação na qual mesclar o código depois que ele for revisado.

  5. Em Ramificação de origem, selecione a ramificação que contém o código confirmado.

  6. Em Título da solicitação pull, insira um título que ajude outros usuários a entender o que precisa ser revisado e por quê.

  7. (Opcional) Na Descrição da solicitação pull, forneça informações, como um link para problemas ou uma descrição das alterações.

    dica

    Você pode escolher Escrever descrição para mim para gerar CodeCatalyst automaticamente uma descrição das alterações contidas na pull request. Você pode fazer alterações na descrição gerada automaticamente depois de adicioná-la à solicitação pull.

    Essa funcionalidade exige que os recursos de IA generativa estejam habilitados para o espaço e não estejam disponíveis para solicitações pull em repositórios vinculados. Para ter mais informações, consulte Gerenciar recursos de IA generativa.

  8. (Opcional) Em Problemas, selecione Vincular problemas e, depois, selecione um problema na lista ou insira seu ID. Para desvincular um problema, selecione o ícone de desvinculação.

  9. (Opcional) Em Revisores obrigatórios, selecione Adicionar revisores obrigatórios. Selecione na lista de membros do projeto para adicioná-los. Os revisores obrigatórios devem aprovar as alterações antes que a solicitação pull seja mesclada na ramificação de destino.

    nota

    Não é possível adicionar um revisor como revisor obrigatório e revisor opcional. Não é possível se adicionar como revisor.

  10. (Opcional) Em Revisores opcionais, selecione Adicionar revisores opcionais. Selecione na lista de membros do projeto para adicioná-los. Revisores opcionais não precisam aprovar as alterações como um requisito antes que a solicitação pull seja mesclada na ramificação de destino.

  11. Revise as diferenças entre as ramificações. A diferença exibida em uma solicitação pull são as alterações entre a revisão na ramificação de origem e a base de mesclagem, que é a confirmação principal da ramificação de destino no momento em que a solicitação pull foi criada. Se nenhuma alteração for exibida, as ramificações podem ser idênticas ou você pode ter escolhido a mesma ramificação para a origem e o destino.

  12. Quando a solicitação pull tiver o código e as alterações que você deseja revisar, selecione Criar.

    nota

    Depois que você criar a solicitação pull, poderá adicionar comentários. Os comentários podem ser adicionados à solicitação pull ou a linhas individuais em arquivos, bem como à solicitação pull geral. Você pode adicionar links para recursos, como arquivos, usando o sinal @ seguido pelo nome do arquivo.

Você pode visualizar informações sobre fluxos de trabalho associados iniciados pela criação dessa solicitação pull selecionando Visão geral e, depois, revisando as informações na área Detalhes da solicitação pull em Execuções do fluxo de trabalho. Para visualizar a execução do fluxo de trabalho, selecione a execução.

dica

Se você nomeou sua ramificação de forma diferente de develop, um fluxo de trabalho não será executado automaticamente para compilar e testar suas alterações. Se você quiser configurar isso, edite o arquivo YAML para o onPullRequestBuildAndTestfluxo de trabalho. Para obter mais informações, consulte Criação de um fluxo de trabalho.

Você pode comentar sobre essa solicitação pull e pedir que outros membros do projeto comentem sobre ela. Você também pode optar por adicionar ou alterar revisores opcionais ou obrigatórios. Você pode optar por fazer mais alterações na ramificação de origem do repositório e ver como essas alterações confirmadas criam revisões para a solicitação pull. Para ter mais informações, consulte Revisão de uma solicitação pull, Atualizar uma solicitação pull, Análise de código com pull requests na Amazon CodeCatalyst e Visualização do status e detalhes de execução do fluxo de trabalho.

Mesclar uma solicitação pull

Depois que uma pull request for revisada e receber as aprovações dos revisores necessários, você poderá mesclar sua ramificação de origem com a ramificação de destino no console. CodeCatalyst A mesclagem de uma solicitação pull também iniciará a execução das alterações por meio de qualquer fluxo de trabalho associado à ramificação de destino. Neste tutorial, você mesclará a ramificação de teste com a principal, o que iniciará a execução do onPushToMainDeployPipelinefluxo de trabalho.

Como mesclar uma solicitação pull (console)
  1. Em Solicitações pull, escolha a solicitação pull que você criou na etapa anterior. Na solicitação pull, selecione Mesclar.

  2. Selecione entre as estratégias de mesclagem disponíveis para a solicitação pull. Também é possível selecionar ou desmarcar a opção de excluir a ramificação de origem depois de mesclar a solicitação pull e, depois, selecionar Mesclar. Após a conclusão da mesclagem, o status da solicitação pull muda para Mesclado e não aparece mais na visualização padrão das solicitações pull. A visualização padrão mostra solicitações pull com o status Aberto. Você ainda pode visualizar uma solicitação pull mesclada, mas não pode aprová-la ou alterar seu status.

    nota

    Se o botão Mesclar não estiver ativo ou você ver o rótulo Não mesclável, um revisor obrigatório ainda não aprovou a pull request ou a pull request não pode ser mesclada no console. CodeCatalyst Um revisor que não aprovou uma solicitação pull é indicado por um ícone de relógio em Visão geral na área Detalhes da solicitação pull. Se todos os revisores obrigatórios aprovaram a solicitação pull, mas o botão Mesclar ainda não estiver ativo, você pode ter um conflito de mesclagem ou ter excedido a cota de armazenamento do espaço. Você pode resolver conflitos de mesclagem para a ramificação de destino em um ambiente de desenvolvimento, enviar as alterações e, em seguida, mesclar a pull request, ou você pode resolver conflitos e mesclar localmente e, em seguida, enviar a confirmação que contém a mesclagem para. CodeCatalyst Para ter mais informações, consulte Mescla de uma solicitação pull (Git) e a documentação do Git.

Visualizar o código implantado

Agora, veremos o código implantado originalmente que estava na ramificação padrão e suas alterações mescladas quando elas são compiladas, testadas e implantadas automaticamente. Para fazer isso, você pode retornar à página de visão geral do repositório e selecionar o número ao lado do ícone de fluxos de trabalho relacionados ou, no painel de navegação, selecionar CI/CD e, depois, selecionar Fluxos de trabalho.

Como visualizar o código implantado
  1. Em Fluxos de trabalho, em onPushToMainDeployPipeline, expanda Execuções recentes.

    nota

    Esse é o nome padrão do fluxo de trabalho para projetos criados com o esquema de Aplicação de página única.

  2. A execução mais recente é aquela iniciada pela confirmação da solicitação pull mesclada na ramificação main e provavelmente exibirá o status Em andamento. Selecione uma execução concluída com sucesso na lista para abrir os detalhes dessa execução.

  3. Selecione Variáveis. Copie o valor para AppURL. Esse é o URL da aplicação web de página única implantada. Abra uma nova guia do navegador e cole o valor para visualizar o código compilado e implantado. Deixe a guia aberta.

  4. Retorne à lista de execuções do fluxo de trabalho e aguarde a conclusão da execução mais recente. Quando isso acontecer, retorne à guia aberta para visualizar a aplicação web e atualizar seu navegador. Veja as alterações feitas na sua solicitação pull mesclada.

Limpar os recursos

Depois de explorar o trabalho com um repositório de origem e uma solicitação pull, talvez você queira remover todos os recursos desnecessários. Não é possível excluir solicitações pull, mas é possível fechá-las. Você pode excluir as ramificações criadas.

Se você não precisar mais do repositório de origem ou do projeto, também poderá excluir esses recursos. Para ter mais informações, consulte Exclusão de um repositório de origem e Excluir um projeto.