DEV Community

Andrea
Andrea

Posted on

Hostear un sitio estatico con CloudFront, SSL y Route53

Se que de estos hay mil articulos, pero como lo tuve que hacer para un sitio personal, lo dejo aca para el que le sirva.

En mi caso, el dominio es hyrule.com.ar

Nota: este articulo asume que tenes el sitio delegado a Route53

Bucket

  1. Crear un S3 bucket para nuestro dominio. Si es www.hyrule.com.ar, nuestro bucket se tiene que llamar hyrule.com.ar
  2. Subir nuestros archivos. Vas a necesitar, al menos, un index.html y un error.html
  3. Una vez creado el bucket, configurarlo para que permita hostear un sitio estatico (ir a Properties -> Static website hosting y habilitarlo)
  4. Podes probar la URL que te da, deberia verse tu sitio. Nota: no es la misma que la del bucket, copiar esa URL a algun lado (la vamos a necesitar mas adelante)

Certificate Manager

  1. Ir a Request a new certificate
  2. Poner nuestros dominios. Usualmente se ponen los dos (con y sin www).
  3. Elegir DNS validation
  4. Va a quedar en estado Pending
  5. Hacer click en el boton Create records in Route 53
  6. Verificar que nos va a crear los dominios que necesitamos, hacer click en el boton Create Records
  7. Listo, ya tenemos un certificado gratis para nuestro dominio

Cloudfront

  1. Crear una nueva distribucion de Cloudfront (desde ahora, CF)
  2. En Origin Domain, pegar la URL que copiamos en el punto 4 del Bucket (algo como http://[bucket].s3-website-us-east-1.amazonaws.com)
  3. Name: poner un nombre significativo
  4. Alternate domain name: poner dominio.com y www.dominio.com (los dos).
  5. Custom SSL Certificate: elegi el certificado que creaste antes (lo deberias ver en el desplegable)
  6. Viewer Protocol policity: usualmente es mejor redirigir HTTP a HTTPS
  7. Price Class: para que te salga mas barato, elegi "Use only North America and Europe". El Free tier tiene un monton de datos gratis, si no es un sitio grande no vas a tener problemas.

Route 53

  1. Click en Create Record
  2. Elegir record type A
  3. Habilitar Alias
  4. Elegir Alias to Cloudfront Distribution
  5. Deberia aparecer en el desplegable la distribucion que creaste en el punto anterior. Si no aparece, revisa que hayas hecho los puntos 4 y 5 de Cloudfront

Listo, una vez que se refresquen los DNS, deberias tener el sitio funcionando.

Top comments (0)