Aprende Astro construyendo un blog real, lección a lección

¿Qué es learning-astro? ¶

learning-astro no es una referencia que tu agente lee por encima: es una experiencia de aprendizaje interactiva. Cuando la activas, tu agente se convierte en un copiloto que explora Astro contigo construyendo un blog personal de verdad, paso a paso.

Sigue un ritmo Descubre → Construye → Reflexiona: primero entiendes el porqué, luego escribes el código en tu propio proyecto, y al final pausáis para comprobar que ha calado de verdad. Se adapta a tu nivel —si vienes de React o si es tu primera web— y trata cada error como una oportunidad de entender Astro por dentro.

Por qué vas a terminarla ¶

No es un tutorial que abandonas en la lección dos. Funciona porque:

• Aprendes haciendo. Construyes un blog real con páginas, content collections, islas y deploy. Acabas con un sitio que puedes seguir creciendo, no con un repo de ejemplo que se borra.
• Tu agente es tu copiloto. Explica las decisiones sobre la marcha, responde tus dudas con la documentación oficial de Astro y te desatasca cuando algo peta, en vez de dejarte solo ante el error.
• Se adapta a tu nivel. Si eres junior, va con calma y celebra los pequeños avances. Si vienes de React, Vue o Next, marca las diferencias de mentalidad y acelera por lo que ya dominas.

Cómo instalar learning-astro ¶

Funciona con cualquier agente compatible con el estándar abierto de Agent Skills (Claude Code, Cursor, Codex, OpenCode, Gemini CLI…). Pega esto en tu terminal y listo:

npx skills add https://github.com/delineas/astro-framework-agents --skill learning-astro

¿Prefieres instalarla a mano? Clona el repo y copia la carpeta a la de skills de tu agente (~/.agents/skills/ para cualquier agente, o ~/.claude/skills/ si usas Claude Code):

git clone https://github.com/delineas/astro-framework-agents.git
cp -r astro-framework-agents/skills/learning-astro ~/.agents/skills/

Es open source con licencia MIT. Puedes ver el código fuente en GitHub antes de instalarla.

Qué incluye ¶

La skill está organizada en tres lecciones de unos 45 minutos, más el material de apoyo que tu agente carga cuando hace falta:

• Lección 1 · Tu primer sitio Astro — páginas, componentes, layouts con slots y estilos con scope. La base del blog.
• Lección 2 · Contenido y rutas dinámicas — Content Collections con schemas tipados (Zod), getStaticPaths, índice del blog y feed RSS.
• Lección 3 · Interactividad y deploy — islas con Preact y client directives, view transitions con ClientRouter y publicación en producción.
• concepts/ — el porqué de Astro: islands architecture, file-based routing, content layer y component model.
• guides/ — guías paso a paso de cada lección con el código exacto a escribir.
• reflect/ + help/ — checkpoints de comprensión tras cada bloque y un catálogo de errores comunes para desatascarte.

Preguntas frecuentes ¶

¿Necesito saber Astro para usarla? ¶

No. La skill arranca preguntándote tu nivel y adapta el ritmo. Vale tanto si es tu primera web como si vienes de React, Vue o Next.js.

¿Con qué agentes funciona? ¶

Con cualquiera compatible con el estándar abierto de Agent Skills: Claude Code, Cursor, OpenAI Codex, OpenCode, Gemini CLI y más. Es un formato portable: la instalas una vez y la usas donde quieras.

¿Cuánto se tarda? ¶

Son 3 lecciones de unos 45 minutos. Puedes parar al final de cualquier lección y retomar más tarde: el agente mira tu proyecto y sigue donde lo dejaste.

¿Tiene coste? ¶

Es open source con licencia MIT. La descargas e instalas gratis; el código está en GitHub.