Este sitio.

Cómo está construido jelopez.link: stack, despliegue y decisiones de diseño.

Stack

  • Framework

    Astro: generador de sitios estáticos. Cada página se genera en el build como HTML plano, sin framework de cliente.

  • Despliegue

    Cloudflare Pages conectado al repositorio de GitHub. Cada push a master despliega automáticamente.

  • Dominio y DNS

    jelopez.link registrado y gestionado en Cloudflare. DNS, certificado TLS y CDN sin infraestructura propia.

Estructura

Son dos proyectos independientes: web (jelopez.link) y blog (blog.jelopez.link), cada uno con su repositorio en GitHub y su proyecto en Cloudflare Pages.

web
Página principal. Astro estático, sin base de datos ni servidor. Los textos viven en un único fichero de contenido.
blog
Blog técnico con posts en Markdown y MDX, RSS y sitemap. Astro gestiona el routing y la colección de contenido.
comentarios
Giscus, basado en GitHub Discussions. Sin base de datos propia ni coste.
idiomas
Cada página existe en español y en inglés con su propia URL (/ y /en/), generadas en el build y enlazadas con hreflang para los buscadores.
privacidad
Sin cookies, sin analítica y sin recursos de terceros: hasta las fuentes se sirven desde el propio dominio.
JavaScript
Ninguno. La animación de la portada, el modo oscuro y las transiciones entre páginas son CSS.
seguridad
Cabeceras HTTP estrictas (CSP, HSTS, Permissions-Policy) definidas en el fichero _headers de Cloudflare Pages.

Diseño

La idea es la de un buen plano de red: ordenado, con rótulos claros y sin adornos que no aporten. La portada lo lleva al pie de la letra con un esquema real del homelab en el que un paquete recorre cada camino. El resto es un CV a dos columnas, fácil de leer en diagonal.

Archivo
Una sola familia variable en peso y anchura: ancha y gruesa para los titulares, normal para el texto. Un único fichero de fuente.
Claro y oscuro
Sigue la preferencia del sistema. En oscuro el fondo es azul noche, no negro; en claro, papel frío.
Coral
El color de la marca, el mismo del blog y del favicon. Se reserva para la acción principal y los enlaces.
Movimiento
Un solo momento animado, el esquema de la portada, más la línea de la experiencia que se rellena al bajar. Todo se desactiva si el sistema pide reducir el movimiento.

Flujo de trabajo

Publicar un post es un proceso local: escribir en Markdown o MDX, hacer commit y push. Cloudflare Pages detecta el cambio y despliega en menos de un minuto.

  1. Escribir

    Post en Markdown o MDX en src/content/blog/, con título, descripción, fecha y tags en el frontmatter.

  2. Commit y push

    Push a la rama master del repositorio Juanen47/blog en GitHub.

  3. Build automático

    Cloudflare Pages ejecuta npm run build y despliega el sitio estático generado.

  4. Publicado

    El post está en blog.jelopez.link menos de un minuto después del push.