An open API service indexing awesome lists of open source software.

https://github.com/lemoncode/astro-desde-cero


https://github.com/lemoncode/astro-desde-cero

Last synced: 10 months ago
JSON representation

Awesome Lists containing this project

README

          

# 🚀 Aprende Astro desde cero — Repositorio de Demos

Este repositorio contiene el código fuente de cada una de las lecciones prácticas del curso **[Aprende Astro desde cero](#)**. Cada carpeta representa un punto específico del curso, para que puedas acceder fácilmente al estado del proyecto en cualquier momento del aprendizaje.

---

## 📁 Estructura del repositorio

Las carpetas están numeradas para seguir el orden del curso. A partir de la lección 03, cada una contiene el código correspondiente al avance de ese punto.

```bash
├── 03-proyecto-inicial/
├── 04-layout-base/
├── 05-setup-hcms/
├── 06-listado-cursos-basico/
├── 07-listado-cursos-diseño/
├── 08-detalle-curso-basico/
├── 09-detalle-curso-diseño/
├── 10-markdown-highlight/
├── 11-client-router/
├── 12-integrando-react/
├── 13-server-actions/
├── 14-server-islands/
```

> Puedes entrar a cada carpeta y seguir los pasos ejecutando `npm install` y luego `npm run dev`.

---

## 🔐 Variables de entorno (desde el ejemplo 05)

A partir del ejemplo **05-setup-hcms**, es necesario crear un archivo `.env` en la raíz del proyecto con el siguiente contenido:

```env
CONTENT_ISLAND_SECRET_TOKEN=f38a94366651cc72879e0d71cfd339d4
```

Este token permite acceder al contenido del proyecto de ejemplo en **Content Island (HCMS)** utilizado en el tutorial.

> ⚠️ Este token es de solo lectura y está pensado para uso educativo en el contexto del curso.

---

## 🎥 Curso en video

Puedes seguir el curso completo y gratuito aquí:
**[Ver curso Aprende Astro desde cero 🚀](https://www.lemoncode.tv/curso/tutorial-astro-desde-cero/leccion/conceptos-astro)**

---

## 🧠 ¿Qué aprenderás?

- Crear un proyecto Astro desde cero
- Usar layouts reutilizables y componentes
- Estilizar con Tailwind CSS
- Mostrar contenido dinámico desde Markdown o Headless CMS
- Crear rutas dinámicas con `getStaticPaths`
- Integrar React dentro de Astro
- Navegación fluida tipo SPA con Client Router
- Crear Server Actions y Server Islands

---

## 🛠 Tecnologías usadas

- **Astro**
- **Tailwind CSS**
- **Markdown**
- **React**
- **Content Island (HCMS)**
- **Node.js**

---

## ✅ Requisitos

- Conocimientos básicos de HTML, CSS y JavaScript
- Node.js instalado
- Ganas de aprender 🚀

---

## 🤝 Contribuciones

Este repositorio está pensado para acompañar el curso, pero puedes proponer mejoras o abrir issues si encuentras errores. ¡Toda ayuda es bienvenida!

---

## 📄 Licencia

MIT © Lemoncode Formación