📰

Blog Estático

🧑‍🍳 Cocinero⏱️ 25 minutos

📋 Prerequisitos sugeridos

  • Markdown básico
  • Git básico

Lo que vas a construir

Tu propio blog estatico con Astro. Podras escribir posts en Markdown, tendras una pagina principal con lista de articulos ordenados por fecha, y paginas individuales para cada post. El sitio sera ultra rapido, seguro, y gratis de hostear en Vercel o GitHub Pages. Es la forma perfecta de documentar lo que aprendes y construir tu presencia online.


Opciones populares

HerramientaLenguajeIdeal para
AstroJSContenido + componentes
HugoGoVelocidad extrema
JekyllRubyGitHub Pages nativo
11tyJSSimplicidad

Paso 1: Pídele a una IA el setup

Necesito un blog estático con Astro que:
- Tenga posts en Markdown
- Muestre lista de posts con fecha
- Tenga página individual por post
- Use Tailwind CSS
- Tenga modo oscuro
- Sea deployable en Vercel

Dame los comandos y estructura.

Paso 2: Crea el proyecto

npm create astro@latest my-blog
cd my-blog
npm run dev

Estructura típica

my-blog/
├── src/
│   ├── content/
│   │   └── posts/
│   │       ├── primer-post.md
│   │       └── segundo-post.md
│   ├── layouts/
│   │   └── PostLayout.astro
│   └── pages/
│       ├── index.astro
│       └── posts/[slug].astro
└── astro.config.mjs

Formato de post

---
title: "Mi primer post"
date: 2024-01-15
description: "Qué aprendí hoy"
tags: ["javascript", "aprendizaje"]
---

# Mi primer post

Contenido en **Markdown**...

Publicar

# Vercel (automático desde GitHub)
npm run build
# Sube a GitHub, conecta con Vercel

Próximo paso

Formulario con Validación — Inputs seguros