Instalación y primer proyecto Astro

Configura tu entorno y crea tu primer proyecto Astro con una estructura limpia desde el inicio.

Una buena instalación evita problemas invisibles más adelante: versiones, scripts y estructura importan.

Vamos a crear un proyecto base con comandos oficiales para tener un punto de partida robusto.

También verás qué archivos mirar primero para entender cómo está montado Astro por dentro.

No vamos a correr: instalar bien una vez te ahorra horas de debugging después.

  • Sigue una secuencia clara y repetible.
  • Usa Node LTS estable.
  • Acepta plantilla mínima para aprender estructura real.
  • Confirma que el servidor levanta en local sin errores.
  • Antes de programar, ubícate.

Pasos de instalación recomendados

Sigue una secuencia clara y repetible.

  • Usa Node LTS estable.
  • Acepta plantilla mínima para aprender estructura real.
  • Confirma que el servidor levanta en local sin errores.

Carpetas que debes conocer

Antes de programar, ubícate.

  • src/pages: rutas del sitio.
  • src/components: componentes reutilizables.
  • public: archivos estáticos.
  • astro.config.*: configuración del proyecto.
Astro
02

Instalación y primer proyecto Astro

Configura tu entorno y crea tu primer proyecto Astro con una estructura limpia desde el inicio.

Código del tema: Componentes Astro + render hibrido

📘 Teoría

Pasos de instalación recomendados

Sigue una secuencia clara y repetible.

  • Usa Node LTS estable.
  • Acepta plantilla mínima para aprender estructura real.
  • Confirma que el servidor levanta en local sin errores.

Carpetas que debes conocer

Antes de programar, ubícate.

  • src/pages: rutas del sitio.
  • src/components: componentes reutilizables.
  • public: archivos estáticos.
  • astro.config.*: configuración del proyecto.

🧪 Aprende probando

Ejemplo Scripts típicos de package.json Comandos de trabajo más usados en fase inicial.

🏁 Retos

Reto Reto: flujo mínimo de arranque Escribe los comandos necesarios para crear y levantar Astro.

🧰 Recursos

Test

Comprueba tus conocimientos con un test sobre Astro.

Test de Astro

¿Qué es esto?

Soy Cristian Eslava y a veces hago webs para procrastinar yo y vosotros. culTest

La hice en febrero de 2026 para facilitar el aprendizaje de mis alumnos. La idea es aprender desarrollo web practicando y que el proyecto siga creciendo con nuevos temas, tests y retos.

Está inspirada en MDN, W3Schools, CodePen, Manz y muchos otros sitios de documentación sobre desarrollo web. Quería combinar teoría útil, ejemplos ejecutables, retos y el sistema de tests que ya tenía en culTest. culTest

Si te gustó, si no te gustó o si quieres escribirme, puedes hacerlo en cristianeslava@gmail.com