Módulo 1: Criar um site estático
Neste módulo, você hospedará seu site estático no Amazon S3 e configurará seu IDE na nuvem, o AWS Cloud9.
Visão geral
Neste módulo, hospedaremos o conteúdo estático (html, js, css, media content etc.) do seu site Mythical Mysfit no Amazon S3 (Simple Storage Service). O S3 é um serviço de armazenamento de objetos resiliente, altamente disponível e barato que pode veicular objetos armazenados diretamente via HTTP. Isso o torna extremamente útil para veicular conteúdo web estático a navegadores da web para sites da Internet.
Antes de começarmos a armazenar nossos mysfits no S3, configuraremos o AWS Cloud9 para você. O Cloud9 é um ambiente de desenvolvimento integrado (IDE) que permite escrever, executar e depurar códigos usando apenas um navegador.
Diagrama de arquitetura

Tempo para a conclusão
20 minutos
Serviços usados
Experimente o GitHub
Instruções de implementação
-
Etapa 1: Introdução
A: Faça login no Console AWS
Para começar, faça login no Console AWS na conta da AWS que você estará usando neste workshop.
B: Selecione uma região
Este aplicativo web pode ser implantado em qualquer região da AWS que seja compatível com todos os serviços usados neste aplicativo. Consulte a tabela de regiões para ver quais regiões têm os serviços compatíveis. As regiões compatíveis incluem:
- leste dos eua-1 (Norte da Virgínia)
- leste dos eua-2 (Ohio)
- oeste dos eua-2 (Oregon)
- oeste da europa-1 (Irlanda)
Selecione uma região no menu suspenso no canto superior direito do Console de gerenciamento da AWS.
-
Etapa 2: Criar o IDE do Mythical Mysfit
A: Crie um novo ambiente do AWS Cloud9
Na página inicial do Console AWS, digite Cloud9 na barra de pesquisa de serviço e selecione:
Dê um nome ao seu ambiente MythicalMysfitsIDE com qualquer descrição que você desejar e clique em Próxima etapa:
Deixe as configurações de Ambiente nas definições padrão e clique em Próxima etapa:
Quando a criação do IDE estiver finalizada, você será presenteado com uma tela de boas-vindas com a seguinte aparência:
B: Clone o Repositório do workshop do Mythical Mysfits
No painel inferior, você verá uma linha de comando de terminal aberta e pronta para ser usada. Execute o seguinte comando git no terminal para clonar o código necessário para a conclusão deste tutorial:
git clone -b python https://github.com/aws-samples/aws-modern-application-workshop.git
Depois de clonar o repositório, você observará que o explorador do projeto agora inclui os arquivos clonados:
No terminal, mude para o diretório do repositório recém-clonado:
cd aws-modern-application-workshop
-
Etapa 3: Hospedar o site no S3
A: Crie um bucket do S3 e configure-o para hospedagem de site
Em seguida, criaremos os componentes de infraestrutura necessários para hospedar um site estático no Amazon S3 por meio da ILC da AWS.
Primeiramente, você criará um bucket do S3 e substituirá o nome a seguir (mythical-mysfits-bucket-name) pelo nome do seu bucket exclusivo. Observação: consulte os requisitos para nomes de bucket. Copie o nome que escolher e guarde-o para mais tarde, pois ele será usado em vários outros lugares durante este workshop:
aws s3 mb s3://REPLACE_ME_BUCKET_NAME
Agora que criamos um bucket, precisaremos definir algumas opções de configuração que permitam que o bucket seja usado para a hospedagem de sites estáticos. Essa configuração permite que os objetos do bucket sejam solicitados usando um nome de DNS público registrado para o bucket, além de solicitações diretas do local ao caminho básico do nome de DNS para a página inicial de um site selecionado (index.html, na maioria dos casos):
aws s3 website s3://REPLACE_ME_BUCKET_NAME --index-document index.html
B: Atualize a Política de bucket S3
Todos os buckets criados no Amazon S3 são totalmente privados por padrão. Para ser usado como site público, é necessário criar uma Política de bucket S3 que indique que objetos armazenados nesse novo bucket podem ser publicamente acessados por qualquer pessoa. As políticas de bucket são representadas como documentos JSON que definem as ações do S3 (chamadas de APIs do S3) que são permitidas (ou não permitidas) a serem executadas por diferentes principais (no nosso caso, o público ou qualquer pessoa).
O documento JSON para a política de buckey necessária está localizado em: ~/environment/aws-modern-application-workshop/module-1/aws-cli/website-bucket-policy.json. Esse arquivo contém uma cadeia de caracteres que precisa ser substituída pelo nome do bucket que você escolheu (indicado por REPLACE_ME_BUCKET_NAME).
Observação: durante este workshop, você abrirá, de maneira semelhante, arquivos cujos conteúdos precisarão ser substituídos (todos terão o prefixo REPLACE_ME_, para facilitar sua detecção usando CTRL-F no Windows ou ⌘-F no Mac.)
Para abrir um arquivo no Cloud9, use o Explorador de arquivos no painel esquerdo e dê um clique duplo em website-bucket-policy.json:
Essa ação abrirá bucket-policy.json no painel do Editor de arquivos. Substitua a cadeia de caracteres mostrada pelo nome escolhido do bucket usado nos comandos anteriores:
Execute o seguinte comando da ILC para adicionar uma política de bucket pública ao seu site:
aws s3api put-bucket-policy --bucket REPLACE_ME_BUCKET_NAME --policy file://~/environment/aws-modern-application-workshop/module-1/aws-cli/website-bucket-policy.json
C: Publique o conteúdo do site no S3
Agora que o novo bucket do site está configurado adequadamente, adicionaremos a primeira iteração da página inicial do Mythical Mysfits ao bucket. Use o seguinte comando da ILC do S3 que imita o comando linux para copiar arquivos (cp) para copiar a página index.html fornecida localmente do seu IDE para o novo bucket do S3 (substituindo adequadamente o nome do bucket).
aws s3 cp ~/environment/aws-modern-application-workshop/module-1/web/index.html s3://REPLACE_ME_BUCKET_NAME/index.html
Agora, abra seu navegador da web e digite um dos URLs a seguir na barra de endereços. Um dos URLs a seguir contém um “.” antes do nome da região, e o outro, um “-”. Qual deles será usado dependerá da região que você estiver usando.
A cadeia de caracteres que deverá substituir REPLACE_ME_YOUR_REGION deve corresponder à região em que você tiver criado o bucket do S3 (p. ex., leste dos eua-1):
Para leste dos eua-1 (Norte da Virgínia), oeste dos eua-2 (Oregon), oeste da europa-1 (Irlanda), use:
http://REPLACE_ME_BUCKET_NAME.s3-website-REPLACE_ME_YOUR_REGION.amazonaws.com
Para leste dos eua-2 (Ohio), use:
http://REPLACE_ME_BUCKET_NAME.s3-website.REPLACE_ME_YOUR_REGION.amazonaws.com
Parabéns, você criou o site estático básico Mythical Mysfits!
Isso conclui o Módulo 1.