Qué es Astro y cuándo usarlo
Astro es un framework orientado a contenido. Está pensado para webs donde la mayor parte de la interfaz puede salir ya renderizada en HTML: blogs, documentación, páginas corporativas, medios, portfolios, directorios o e-commerce con mucha parte estática.
Su idea central es simple: si algo no necesita JavaScript en el navegador, no se le manda JavaScript.
La diferencia clave
En muchos stacks modernos, incluso una página casi estática acaba enviando bastante JavaScript al cliente. Astro no parte de ahí. Parte de HTML primero.
Eso te da:
- mejor rendimiento inicial
- menos coste de hidratación
- menos complejidad si el sitio es sobre todo contenido
Cuándo encaja bien
Astro encaja muy bien cuando quieres construir:
- una home de marketing
- un blog
- documentación
- una web de servicios
- un catálogo
- una base de conocimiento
Si el proyecto es una app compleja y muy interactiva desde el minuto uno, seguramente no sea tu mejor punto de partida.
Qué significa “islands”
Astro puede renderizar casi toda la página como HTML estático y luego hidratar solo piezas concretas: un buscador, un carrusel, un contador, un filtro, un formulario complejo.
Eso es el patrón de islands architecture.
No hidratas toda la página. Solo las islas interactivas.
Astro no compite con React
Astro puede convivir con React, Vue, Svelte o Solid. De hecho, puedes usar componentes de esos frameworks dentro de Astro cuando realmente los necesitas.
La diferencia es que Astro los trata como herramientas puntuales, no como base obligatoria para todo.
La mentalidad correcta
Astro funciona especialmente bien si piensas así:
- primero resuelvo la página en HTML
- luego añado estilos
- solo después meto interactividad si hace falta
Si llegas con mentalidad de SPA para todo, te perderás una parte importante de su ventaja.
Qué vas a aprender en este curso
En este curso vas a ver:
- cómo se organiza un proyecto Astro
- cómo funciona el frontmatter
- cómo se crean páginas y rutas
- cómo se usan layouts y slots
- cómo se integran imágenes y estilos
- cuándo usar
client:* - cómo trabajar con contenido tipado
La siguiente lección entra en una de las piezas más importantes: la estructura del proyecto y el famoso frontmatter.