Hospedar um site estático
hospede seu site de marketing ou aplicação Web simples na AWS
Introdução
Os sites estáticos fornecem HTML, JavaScript, imagens, vídeo e outros arquivos aos visitantes do site. Os sites estáticos são muito econômicos, oferecem altos níveis de confiabilidade, não exigem praticamente nenhuma administração de TI e sua escala pode ser alterada para processar tráfego de nível corporativo sem trabalho adicional.
Confira as perguntas frequentes para obter mais informações >>
O que você aprenderá
- Hospedar um site estático usando o AWS Amplify no Console da AWS. O AWS Amplify oferece hospedagem totalmente gerenciada para sites estáticos e aplicativos Web. A solução de hospedagem do Amplify usa o Amazon CloudFront e o Amazon S3 para enviar os ativos do seu site pela rede de entrega de conteúdo (CDN) da AWS.
- Configurar a implantação contínua: o Amplify oferece um fluxo de trabalho baseado no Git com implantação contínua, possibilitando que você implante automaticamente atualizações no seu site cada vez que você confirmar as alterações.
Experiência com a AWS
Iniciante
Tempo para a conclusão
10 minutos
Custo para a conclusão
- Fora dos limites do nível gratuito da AWS: normalmente de USD 1 a USD 3 por mês.
- Dentro dos limites de nível gratuito da AWS: normalmente US$ 0,50 por mês.
Para obter um detalhamento dos serviços usados e dos custos associados, consulte os preços do AWS Amplify e do Amazon Route 53
Pré-requisitos do tutorial
- Conta da AWS com acesso de administrador* Cadastrar-se na AWS.
- Provedor de Git: você pode usar o AWS CodeCommit (incluso no nível gratuito da AWS) ou o GitHub.
Data da última atualização
27 de setembro de 2022
Implementação
-
Criar e conectar um repositório
Para começar este tutorial, você precisará criar e inicializar um repositório. A maneira mais fácil de fazer isso é usar o comando create-react-app. Instale este pacote usando o comando a seguir no prompt de comando ou terminal.
Já tem um repositório para conectar? Pule para a etapa C abaixo.Quer implantar sem se conectar a um provedor Git? Comece clicando aqui.npx create-react-app amplifyapp cd amplifyapp npm start
Nesta etapa, você criará um repositório do GitHub e confirmará o seu código no repositório. Você precisará de uma conta no GitHub para concluir esta etapa. Se você não tiver uma conta, inscreva-se aqui.
a. Crie um novo repositório GitHub para o seu aplicativo (link)
b. Inicialize o git e envie a aplicação ao novo repositório do GitHub executando os seguintes comandos na interface da linha de comandos:
git init git remote add origin git@github.com:username/reponame.git git add . git commit -m “initial commit” git push origin master
c. Para conectar seu repositório, faça login no console do Amplify e escolha Começar na parte superior da página e depois Começar em Amplify Hosting.
Conecte seus repositórios GitHub, Bitbucket, GitLab ou AWS CodeCommit. Você também pode fazer upload manual de seus artefatos de compilação sem conectar um repositório Git (consulte Implantações manuais). Depois de autorizar o Console do Amplify, o Amplify busca um token de acesso do provedor de repositório, mas não o armazena nos servidores da AWS. O Amplify acessa seu repositório usando as chaves de implantação instaladas apenas em um repositório específico.
Depois de você se conectar ao provedor de serviços de repositório, escolha um repositório e selecione uma ramificação correspondente para compilar e implantar.
-
Confirme as configurações de compilação
Para a ramificação selecionada, o Amplify inspeciona seu repositório para detectar automaticamente a sequência de comandos de compilação a ser executada. Confirme suas configurações de compilação e clique em Next (Avançar).
-
Salve e implante
Confira todas as configurações para garantir que tudo está definido corretamente. Escolha Save and deploy (Salvar e implantar) para implantar seu aplicativo Web para uma rede de entrega de conteúdo (CDN) global. Sua compilação de front-end normalmente leva de 1 a 2 minutos, mas pode variar com base no tamanho do aplicativo.
Parabéns!
Você concluiu o tutorial Host a Static Website on AWS.