Desplegando un sitio estático con Docker

A menudo me encuentro con la necesidad de desplegar sitios simples en HTML, muchos de ellos estáticos. Me gustaría enseñaros como podemos desplegar un sitio estático o como incorporar un servidor web a Docker.

Primero vamos a definir la configuración del servidor web, el responsable de hacer accesible el sitio. Usaré Nginx para tal fin. ¿Por qué no Apache, Caddy u otros? Principalmente uso Nginx porque es un estándar en la industria. Sin embargo hay otros motivos igual de interesantes, como que es muy rápido, ligero y es el servidor web que yo conozca con más configuraciones avanzadas. Puedes activar elementos como balanceo de carga, caché, compresión, proxy, entre otros.

Crea el archivo nginx.conf con el siguiente contenido:

events {}

http {
  server {
      listen 80 default_server;
      server_name _;
      root /usr/share/nginx/html;
      include /etc/nginx/mime.types;
      index index.html;
      gzip on;
      gzip_disable "msie6";

      location = /favicon.ico { access_log off; log_not_found off; }
  }
}

A lo largo del tiempo, esta a sido la configuración que más óptima me ha resultado. No dudes en modificarla a tu gusto.

Crea un directorio llamado public. Dentro el archivo index.html o cualquier sitio que quieras desplegar. Es importante que el archivo index.html esté presente. En caso contrario, Nginx devolverá un error 403.

A continuación definimos compose.yaml, o actualizamos el fichero existente, con el siguiente servicio:

services:

  nginx:
    restart: "always"
    image: nginx:alpine
    ports:
      - 8000:80
    volumes:
      - ./nginx.conf:/etc/nginx/nginx.conf
      - ./public:/usr/share/nginx/html:ro

Recuerda que tanto nginx.conf como public deben estar en el mismo directorio que compose.yaml.

Por último, levantamos el servicio de Docker.

docker compose up -d

Ya puedes acceder a tu sitio estático en http://localhost:8000. ¡Lo hemos logrado!

Como apuntes finales, en el caso de necesitar especificar un dominio, deberíamos modificar el archivo nginx.conf. Cambia server_name _; por server_name tu-dominio.com;. Si quieres usar el puerta 80, el por defecto de cualquier sitio, deberás cambiar el puerto en ports por 80:80 en compose.yaml. Otra necesidad muy común es disponer de un certificado SSL válido, o activar el protocolo HTTPS. Para ello necesitarás jugar con Let Encrypt, certbot o cualquier otro servicio de certificados.

¡Espero que te haya sido útil! Si tienes alguna duda, no dudes en preguntar.