Hospedagem de site estático na AWS (Nuvem Amazon)

Saiba como hospedar gratuitamente um site com conteúdo estático (HTML, CSS, Imagens e JS ) na nuvem AWS utilizando o serviço S3 e usufruindo de segurança, escalabilidade e velocidade.

Serviço Amazon Simple Storage Service (Amazon S3)

O primeiro serviço que precisamos aprender a usar é o Amazon Simple Storage Service (S3). O S3 é um serviço de armazenamento de objetos que basicamente serve para hospedagem qualquer conteúdo no formato de arquivo. Podemos compará-lo com um bom e velho serviço de FTP, porém muito mais robusto, escalável, barato e com uma incrível garantia de armazenamento de dados beirando os 100%.

No primeiro ano de uso você pode armazenar em sua conta AWS até 5GB gratuitamente.

Afinal Como isso vai funcionar?

Pois bem, agora que está compreendido que vamos utilizar o serviço S3 para armazenar nosso site na AWS, deixemos de enrolação e vamos agora direto ao ponto. Supondo que você já abriu sua conta na AWS e agora já está elegível por 12 meses nos serviços de nível grátis (free tear), vamos criar um novo bucket (como são chamados os "diretórios") no serviço S3. Nesse bucket iremos realizar o upload dos arquivos correspondentes ao nosso site ou sistema.

  1. Assim que que você realizar o login na sua conta AWS e estiver no console de gerenciamento, selecione o serviço S3. Você poderá realizar essa seleção de duas formas, a primeira delas é clicando o ícone do serviço ou procurando-o através da caixa de pesquisa.

2. Quando abrir a janela de listagem de buckets, clique no botão "Create Bucket", para abrir o assistente de criação de bucket. Será nele que realizaremos o upload dos arquivos de nosso site ou sistema.

3. Assim que o assistente de criação abrir, informe o nome para seu bucket. Eu recomendaria colocar algo do tipo "app.meusuite.com.br" para representar o possível endereço de seu site. A partir de agora basta ir clicando no botão "Próximo" até a etapa de conclusão.

O nome de um bucket devem ser único globalmente, por essa razão é impossível utilizar nomes idênticos de qualquer outro bucket já criado no mundo. Caso aconteça de você receber uma mensagem de erro dizendo que o nome já existe, tente outro.

4. Pronto! Suponho que seu bucket foi criado com sucesso. Entre nele e faça upload de todos os arquivos de seu site.

5. Logo que o processo de upload dos arquivos finalizar, precisaremos configurar nosso bucket de modo a permitir acesso público de leitura. Também devemos incluir uma política de acesso e segurança para evitar manipulação indevida de seu conteúdo armazenado. Dessa forma nosso bucket "entenderá" que dentro dele existe conteúdo estático que pode ser acessado por qualquer pessoa na internet, porém sem direito a modificar nada que esteja armazenado.

Para realizar essas configurações, siga os seguintes passos:

  • Ainda dentro do bucket, clique na aba Permissões e depois no botão Editar.

  • Assim que surgir a janela de configuração de acesso, desmarque a opção: "Bloquear todo o acesso público" e clique no botão Salvar.

Você receberá uma mensagem informando que essa é uma operação não recomendada por questões de segurança. É fundamente que você digite "confirmar" no campo que é exigido, pois só assim será possível continuar para o próximo passo.

  • Agora que nosso bucket está com acesso público iremos incluir uma política de acesso para garantir mais segurança ao nosso conteúdo e evitar que ninguém sem a devida autorização mexa manipule os arquivos armazenados. Para isso iremos precisar clicar no botão "Politica de bucket" e colar o conteúdo JSON apresentado logo abaixo na caixa de texto do editor de políticas de bucket. Quando for finalizada essa etapa basta clicar no botão "Salvar".

É fundamente que você substitua a string [YOUR_BUCKET_NAME] pelo nome de seu bucket.

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow", 
            "Principal": "*", 
            "Action": "s3:GetObject", 
            "Resource": "arn:aws:s3:::[YOUR_BUCKET_NAME]/*" 
        } 
    ] 
}

6. A partir de agora iniciaremos nossa última etapa de configuração e hospedagem de nosso site. Clique na aba "Propriedades" e depois no cartão "Hospedagem de site estático".

7. Marque a opção "Usar esse bucket para hospedar um site", informe o nome de seu arquivo de índice (index.html), copie o endereço URL que foi gerado para seu site (endpoint) e clique no botão "Salvar".

Assim que for finalizada essa última etapa, basta você digitar o endereço URL gerado pelo serviço S3 em qualquer browser para ter acesso ao seu site.

Se você também deseja usar um serviço de CDN e gerenciamento de DNS em seu site, a AWS disponibiliza outros dois serviços muito baratos. Um deles é o CloudFront para o CDN e o Route 53 para o serviço de DNS.

É importante ressaltar que o endereço URL gerado não utiliza certificado SSL e portanto não é um endereço HTTPS. Caso você queira utilizar em sua URL um certificado SSL a AWS possui um serviço chamado "Certificate Manager" que abordaremos em próximos tutorias.

Obrigado por chegar até aqui! 🤓

Last updated