Desarrollo web

Última actualización: 2025-04-19

Creación de sitios web estáticos con Amazon S3

Amazon Simple Storage Service (S3) es un servicio de almacenamiento de objetos altamente escalable, duradero y disponible en la nube de AWS. Su arquitectura está diseñada para almacenar y recuperar cualquier cantidad de datos en cualquier momento, lo que lo convierte en una solución ideal para alojar sitios web estáticos. El usuario almacena los archivos de su sitio web (HTML, CSS, JavaScript, imágenes, etc.) como objetos dentro de un bucket de S3, y luego configura este bucket para que actúe como un servidor web. S3 sirve estos archivos directamente a los visitantes del sitio web a través de HTTP, ofreciendo un rendimiento rápido y confiable con costos operativos significativamente bajos, ya que solo se paga por el almacenamiento que utiliza y la transferencia de datos.

Pasos a seguir

  1. Desde el Learner Lab ir a la consola de AWS y seleccionar S3. Presionar el botón de Crear bucket y completar el formulario con la siguiente información (las opciones no mencionadas aquí se deben dejar con su valor por omisión):

    • Tipo de bucket: Uso general
    • Nombre del bucket: El nombre del bucket debe ser ÚNICO A NIVEL GLOBAL y debe tener entre 3 y 63 caracteres. Así mismo, debe comenzar y terminar con una letra o un número. Los caracteres válidos son letras, dígitos, punto (.) y guión (-).
    • Deseleccionar la casilla «Bloquear todo el acceso público».
    • Seleccionar la casilla «Reconozco que la configuración actual puede provocar que este bucket y los objetos que contiene se vuelvan público».

    Presionar el botón Crear bucket.

  2. En el listado de «Buckets de uso general» dar clic a la liga con el nombre del bucket recién creado. En la pestaña de «Objetos», presionar el botón de ↥Cargar. Seleccionar todos los archivos y directorios que forman parte del sitio web estático. Es importante que existan los siguientes dos archivos en la raíz del bucket:

    • index.html: Página que se mostrará por omisión al acceder al sitio.
    • 404.html: Página que se mostrará cuando un archivo soliciatdo no se encuentre.

    Presionar el botón Cargar. Cuando la carga de archivos haya concluido, presionar el botón Cerrar.

    Es posible regresar en un futuro a esta pestaña de «Objetos» para añadir, actualizar y borrar archivos de nuestro sitio web.

  3. Seleccionar la pestaña de «Propiedades» y en la sección titulada «Alojamiento de sitios web estáticos» en la parte inferior de la página dar clic en botón Editar. Completar el formulario con la siguiente información (las opciones no mencionadas aquí se deben dejar con su valor por omisión):

    • Alojamiento de sitios web estáticos: Habilitar
    • Documento de índice: index.html
    • Documento de error - opcional: 404.html

    Presionar el botón Guardar cambios.

  4. Seleccionar la pestaña de «Permisos» y en la sección titulada «Política de bucket» dar clic en botón Editar. Copiar el siguiente código de JSON y pegarlo en el área de texto de «Política»:

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

    Reemplazar el texto NOMBRE-BUCKET con el nombre del bucket recién creado y presionar el botón Guardar cambios.

  5. Seleccionar la pestaña de «Propiedades». En la parte inferior de la página se encuentra el «Punto de enlace de sitio web del bucket». Para ir al sitio web recién creado basta con dar clic al URL o se puede copiar la dirección.