Frontend is for Everyone (Portuguese)

Visão geral do laboratório

Para profissionais de tecnologia que têm experiência no desenvolvimento de scripts e uma ideia nova, criar um front-end como prova de conceito ou produto mínimo de sucesso parece algo impossível. Neste cenário, cabe a você provisionar instâncias do Linux para sua equipe usar. Você já melhorou esse processo com uma nova função do AWS Lambda, que inicia instâncias do Elastic Compute Cloud (EC2) com as tags apropriadas. E se houvesse uma ferramenta de autoatendimento na web que não exigisse o login no console da AWS? Neste laboratório, você vai criar uma aplicação de autenticação para que os usuários iniciem e terminem instâncias do EC2. A aplicação tem apenas uma página, com pilha completa e sem servidor.

Você vai conhecer os recursos da biblioteca React para a criação de interfaces do usuário. Depois você vai usar o AWS Amplify para adicionar serviços da AWS e integrá-los ao front-end. Isso inclui adicionar autenticação pelo Amazon Cognito e criar uma API REST segura com o Amazon API Gateway. Você vai estender o back-end com uma função sem servidor do AWS Lambda que vai interagir com o serviço do Amazon EC2.

Por último, você vai usar o AWS Amplify para hospedar a aplicação, que será disponibilizada aos usuários finais na rede de entrega de conteúdo da AWS usando o Amazon CloudFront. Todo o desenvolvimento de aplicações ocorre no IDE do AWS Cloud9.

Objetivos

Ao final do laboratório, você vai saber como:

• Criar e hospedar uma aplicação web de pilha completa na AWS.
• Implementar conceitos do React como estados, efeitos e props.
• Criar recursos de autenticação, de API, de função e de hospedagem na AWS usando o AWS Amplify.
• Integrar o front-end a serviços de back-end.

Duração

O laboratório leva aproximadamente 60 minutos para ser concluído.

Lista de ícones

Vários ícones são usados neste laboratório para chamar a atenção para diferentes tipos de instruções e observações. A lista a seguir explica a finalidade de cada ícone:

• Comando: um comando que você precisa executar.
• Saída esperada: um exemplo que você pode usar para verificar a saída de um comando ou arquivo editado.
• Observação: uma sugestão, dica ou orientação importante.
• Atenção: informações de interesse ou importância especial (não tão importantes a ponto de causar problemas com o equipamento ou dados caso você não as veja, mas que podem resultar na necessidade de repetir determinadas etapas).
• A considerar: um momento de parar e pensar em como aplicar um conceito no seu ambiente ou iniciar uma conversa sobre o tópico em questão.
• Teste de conhecimento: uma oportunidade de verificar seu conhecimento e testar o que você aprendeu.
• Atualizar: um momento em que talvez seja necessário atualizar uma página ou lista do navegador da web para mostrar novas informações.
• Tarefa concluída: um ponto de conclusão ou de resumo no laboratório.