Cómo construyo y publico esta web.
Desarrollo esta web bilingüe con Next.js y la publico con un script que comprueba cada paso y restaura la versión anterior si una comprobación falla.
No hay servidor de aplicación: Caddy sirve archivos estáticos. Todas las comprobaciones que describo se ejecutan en cada publicación.
La configuración
La web es una exportación estática de Next.js en inglés y español. La imagen de producción la construye con Node.js y sirve los archivos con Caddy, así que en producción no se ejecuta ningún proceso de Node.js.
Funciona como un único contenedor en un servidor pequeño de Hetzner detrás de Cloudflare, que gestiona el TLS de cara a los visitantes y cachea las páginas en el borde.
Qué construí
El build, el proceso de publicación y las comprobaciones que los rodean.
Builds verificados
El build de la imagen ejecuta el linter, la comprobación de tipos y la exportación estática, y falla si falta una página esperada o reaparece una dirección retirada.
Publicación solo desde main
El script solo publica un commit limpio de main que coincide con el remoto. Sube el código con una suma de verificación, construye la imagen en el servidor y la etiqueta con el commit.
Comprobaciones y rollback automático
Antes del cambio, valida la configuración del servidor web. Después, comprueba el nuevo contenedor y el origen, purga las páginas públicas de la caché de Cloudflare y ejecuta pruebas públicas. Si una comprobación falla, restaura la imagen anterior.
Alojamiento protegido
El contenedor se ejecuta en solo lectura y sin ninguna capacidad de Linux salvo la necesaria para abrir los puertos web. Las respuestas incluyen una Content Security Policy estricta y otras cabeceras de seguridad. La administración del servidor usa SSH sobre una red privada de Tailscale.
Pruebas en los dos idiomas
Las pruebas de Playwright cubren los dos idiomas, cada página de servicio, la navegación en móvil y escritorio y el movimiento reducido, con comprobaciones automáticas WCAG A y AA mediante axe.
Componentes
La web, su imagen de contenedor y el script de publicación viven en un mismo repositorio.
- Web
- Next.js · TypeScript · CSS Modules
- Servidor web
- Caddy · cabeceras de seguridad
- Alojamiento
- Docker Compose · Hetzner Cloud
- Borde
- Caché de Cloudflare · Web Analytics
- Publicación
- Bash · API de Cloudflare · SSH sobre Tailscale
- Pruebas
- Playwright · axe
¿Quieres publicaciones que se puedan repetir?
Cuéntame cómo despliegas hoy tu aplicación, con qué frecuencia cambia y qué suele fallar.
Ver el servicio