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 aprender a:

• Visualize os repositórios de origem de um projeto e navegue por seus conteúdos

• Crie um ambiente de desenvolvimento com uma nova ramificação onde você pode trabalhar no código

• Altere um arquivo, confirme e envie suas alterações

• Crie uma pull request e revise suas alterações de código com outros membros do projeto

• Veja o fluxo de trabalho do seu projeto, crie e teste automaticamente as alterações na ramificação de origem da pull request.

• Mescle suas alterações da ramificação de origem na ramificação de destino e feche a pull request

• Veja as alterações mescladas criadas 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 pull request. 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 introdução.

Criando um projeto com um blueprint

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

Se você já tem um projeto, pode pular paraVisualizando os repositórios de um projeto.

nota

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

Para criar um projeto com um blueprint

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. Escolha Começar com um blueprint.

   dica

   Você pode optar por adicionar um blueprint fornecendo à Amazon Q os requisitos do seu projeto para que o Amazon Q sugira um blueprint para você. Para obter mais informações, consulte Usando o Amazon Q para escolher um modelo ao criar um projeto ou adicionar funcionalidade e Melhores práticas ao usar o Amazon Q para criar projetos ou adicionar funcionalidades com blueprints. Esse recurso está disponível somente na região Oeste dos EUA (Oregon).

   Essa funcionalidade exige que recursos generativos de IA estejam habilitados para o espaço. Para obter mais informações, consulte Gerenciamento de recursos generativos de IA.

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. Como alternativa, você pode optar por armazenar o código-fonte do blueprint em um repositório de terceiros. Para ter 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 ter 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.

   Faça o seguinte, dependendo do provedor de repositório terceirizado 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 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 obter 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, escolha Bitbucket como provedor de repositório e, em seguida, escolha o espaço de trabalho do Bitbucket em que você deseja armazenar o código-fonte criado pelo blueprint.

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

     Escolha o menu suspenso Avançado, escolha GitLab como provedor do repositório e 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 blueprint. Dependendo do blueprint, você pode ter a opção de nomear o nome do 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, escolha Exibir código ou Exibir fluxo de trabalho em Gerar visualização do projeto.

9. (Opcional) Escolha Exibir detalhes no cartão do blueprint para ver detalhes específicos sobre o blueprint, como uma visão geral da arquitetura do blueprint, conexões e permissões necessárias e o tipo de recursos que o blueprint 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 pull requests. Opcionalmente, você pode escolher criar um problema e atribuí-lo a si mesmo. Você também pode optar por convidar outra pessoa para o seu projeto. Para obter mais informações, consulte Criando um problema no CodeCatalyst e Convidar um usuário para um projeto.

Visualizando 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 optar por 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 obter mais informações, consulte Criando 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.

Para navegar até os repositórios de origem de um projeto

1. Navegue até seu projeto e faça o seguinte:

   • Na página de resumo do seu projeto, escolha o repositório desejado na lista e escolha Exibir repositório.

   • No painel de navegação, selecione Código e, em seguida, selecione Repositórios de origem. Em Repositórios de origem, escolha 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 pull requests e fluxos de trabalho. Por padrão, o conteúdo da ramificação padrão é exibido. Você pode alterar a exibição escolhendo 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 pull requests configurados para as ramificações desse repositório e seus arquivos. Se você acabou de criar o projeto, os fluxos de trabalho iniciais para criar, 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 seu status escolhendo o número abaixo de Fluxos de trabalho relacionados, mas isso abre a página Fluxos de trabalho em CI/CD. Para este tutorial, fique na página de visão geral e explore o código no repositório. O conteúdo do README.md arquivo é renderizado nesta página abaixo dos arquivos do repositório. Em Arquivos, o conteúdo da ramificação padrão é mostrado. Você pode alterar a visualização do arquivo para mostrar o conteúdo de outra ramificação, se você tiver uma. A .codecatalyst pasta 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, escolha a seta ao lado do nome da pasta para expandi-la. Por exemplo, escolha a seta ao lado de src para visualizar os arquivos do aplicativo Web de página única contido nessa pasta. Para visualizar o conteúdo de um arquivo, escolha-o na lista. Isso abrirá Exibir arquivos, onde você poderá navegar pelo conteúdo de vários arquivos. Você também pode editar arquivos únicos no console, mas para editar vários arquivos, convém criar 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çãodevelop, um fluxo de trabalho será executado automaticamente para criar e testar seu código quando você criar uma pull request posteriormente neste tutorial.

dica

Se você decidir clonar um repositório localmente em vez de ou além de usar um ambiente de desenvolvimento, certifique-se de ter o Git em seu computador local ou de que seu IDE inclua o Git. Para ter 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. Escolha o nome do repositório na lista de repositórios de origem do projeto. Como alternativa, no painel de navegação, escolha Código, escolha Repositórios de origem e escolha o repositório para o qual você deseja criar um ambiente de desenvolvimento.

4. Na página inicial do repositório, escolha Create Dev Environment.

5. Escolha um IDE compatível no menu suspenso. Consulte Ambientes de desenvolvimento integrados compatíveis para ambientes de desenvolvimento Para 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 Dev Environment, você pode editar arquivos, confirmar suas alterações e enviar suas alterações para a test ramificação. Para este tutorial, edite o conteúdo entre as <p> tags no App.tsx arquivo na src pasta 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. srcExpanda e abraApp.tsx.

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

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

   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.

Criação de uma solicitação pull

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

Para criar uma pull request

1. Navegue até o projeto.

2. Execute um destes procedimentos:

   • No painel de navegação, escolha Código, escolha Pull requests e, em seguida, escolha Create pull request.

   • Na página inicial do repositório, escolha Mais e, em seguida, escolha Criar pull request.

   • Na página do projeto, escolha Criar pull request.

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

4. Em Agência de destino, escolha a ramificação na qual mesclar o código depois que ele for revisado.

5. Na ramificação de origem, escolha a ramificação que contém o código confirmado.

6. Em Título do pull request, 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 pull request, forneça informações como um link para problemas ou uma descrição de suas 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 ao pull request.

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

8. (Opcional) Em Problemas, escolha Vincular problemas e, em seguida, escolha um problema na lista ou insira sua ID. Para desvincular um problema, escolha o ícone de desvinculação.

9. (Opcional) Em Revisores obrigatórios, escolha Adicionar revisores obrigatórios. Escolha na lista de membros do projeto para adicioná-los. Os revisores obrigatórios devem aprovar as alterações antes que o pull request possa ser mesclado na ramificação de destino.

   nota

   Você não pode adicionar um revisor como revisor obrigatório e como revisor opcional. Você não pode se adicionar como revisor.

10. (Opcional) Em Revisores opcionais, escolha Adicionar revisores opcionais. Escolha na lista de membros do projeto para adicioná-los. Os revisores opcionais não precisam aprovar as alterações como requisito para que a pull request possa ser incorporada à ramificação de destino.

11. Analise as diferenças entre as filiais. A diferença exibida em uma pull request 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 pull request 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 você estiver convencido de que a pull request contém o código e as alterações que você deseja revisar, escolha Criar.

    nota

    Depois de criar a pull request, você pode adicionar comentários. Os comentários podem ser adicionados à pull request ou a linhas individuais em arquivos, bem como à pull request 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 pull request escolhendo Visão geral e, em seguida, revisando as informações na área de detalhes da pull request em Execuções do fluxo de trabalho. Para visualizar a execução do fluxo de trabalho, escolha a execução.

dica

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

Você pode comentar sobre essa pull request 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 pull request. Para obter mais informaçõesAnalisando uma pull request, consulte Atualizando uma pull requestAnálise de código com pull requests na Amazon CodeCatalyst,, Visualizando o status e os detalhes da execução do fluxo de trabalho e.

Mesclando uma pull request

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 pull request 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.

Para mesclar uma pull request (console)

1. Em Pull requests, escolha a pull request que você criou na etapa anterior. No pull request, escolha Mesclar.

2. Escolha entre as estratégias de mesclagem disponíveis para o pull request. Opcionalmente, selecione ou desmarque a opção de excluir a ramificação de origem após mesclar a pull request e, em seguida, escolha Mesclar. Após a conclusão da mesclagem, o status da pull request muda para Mesclado e não aparece mais na visualização padrão das pull requests. A visualização padrão mostra pull requests com o status Aberto. Você ainda pode visualizar uma pull request 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 pull request é indicado por um ícone de relógio em Visão geral na área de detalhes da pull request. Se todos os revisores obrigatórios aprovaram o pull request, 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 obter mais informações, consulte Mesclando uma pull request (Git) e sua documentação do Git.

Visualizando o código implantado

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

Para visualizar o código implantado

1. Em Fluxos de trabalho, emonPushToMainDeployPipeline, expanda Execuções recentes.

   nota

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

2. A execução mais recente é aquela iniciada pela confirmação do pull request mesclado na main ramificação e provavelmente mostrará o status Em andamento. Escolha uma execução concluída com êxito na lista para abrir os detalhes dessa execução.

3. Escolha Variáveis. Copie o valor para appURL. Esse é o URL do aplicativo web de página única implantado. Abra uma nova guia do navegador e cole o valor para ver o código criado 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 que você abriu para visualizar o aplicativo da web e atualizar seu navegador. Você deve ver as alterações que você fez na sua pull request mesclada.

Como excluir recursos

Depois de explorar o trabalho com um repositório de origem e uma pull request, talvez você queira remover todos os recursos desnecessários. Você não pode excluir pull requests, mas pode fechá-las. Você pode excluir qualquer ramificação criada.

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 Excluindo um repositório de origem e Excluir um projeto.