Cómo configuré mi portfolio con Astro

astro portfolio tutorial docker sysadmin

Cómo configuré mi portfolio con Astro

Después de terminar mis prácticas en Grupo SIAP, decidí crear mi portfolio profesional desde cero. Quería un sitio rápido, seguro y fácil de mantener. Después de evaluar varias opciones, me decidí por Astro por su excelente rendimiento y simplicidad.

¿Por qué Astro?

Astro destaca por su filosofía de “Islands Architecture”:

  • Cero JavaScript por defecto: Las páginas son HTML puro a menos que necesites interactividad
  • Content Collections: Sistema tipo headless CMS para organizar contenido
  • Generación estática: HTML estático significa rendimiento excepcional y seguridad máxima
  • Build rápido: Genera sitios estáticos extremadamente rápidos

Stack tecnológico

Mi configuración actual:

// astro.config.mjs
export default defineConfig({
  site: 'https://christian-escacha.es',
  vite: {
    plugins: [tailwindcss()]
  }
});

Dependencias principales:

  • Astro 5: Framework principal
  • Tailwind CSS: Para estilos
  • Docker + Nginx: Para despliegue en producción

Estructura del proyecto

src/
├── components/     # Componentes reutilizables
├── content/
│   ├── blog/      # Posts del blog
│   └── projects/  # Proyectos
├── layouts/        # Layouts base
├── pages/         # Rutas del sitio
└── styles/         # CSS global

Seguridad

El portfolio es completamente estático:

  • Sin backend, sin base de datos
  • Sin formularios que procesen datos
  • Sin analytics de terceros
  • Rate limiting configurado en Nginx si se despliega en servidor propio

Esto elimina clases enteras de vulnerabilidades potenciales.

Despliegue con Docker

El sitio puede correr en un contenedor Docker con Nginx:

FROM nginx:alpine
COPY dist/ /usr/share/nginx/html/
EXPOSE 80

SSL con certificado self-signed para desarrollo, configurable para producción con Let’s Encrypt.

Ventajas como administrador de sistemas

Desde el punto de vista de un administrador de sistemas, Astro ofrece:

  • Menor superficie de ataque: Solo archivos estáticos
  • Fácil backup: Solo copia los archivos
  • Sin actualizaciones de runtime: No hay Node.js ejecutándose
  • Escalabilidad horizontal: Cualquier servidor web sirve los archivos

¿Preguntas sobre la configuración? El código fuente está disponible en mi perfil de GitHub.