📌 ¿Por qué elegir este método para crear un blog?
Muchas personas quieren tener su propio sitio de blog, pero se ven frenadas por el coste del servidor, la configuración del entorno o el despliegue del código. La solución que presentamos aquí ofrece:
- ✅ Totalmente gratuito: cuota permanente gratuita de GitHub + Cloudflare Workers Pages
- ✅ Acceso ultrarrápido: CDN global de Cloudflare
- ✅ Actualizaciones sencillas: despliegue automático al hacer push en Git; escribir un artículo es como redactar un documento
- ✅ Dominio personalizado: permite vincular tu propio dominio
🛠️ Paso 1: elegir la plantilla de blog que prefieras
1.1 Buscar proyectos en GitHub
Abre GitHub y en la barra de búsqueda introduce palabras clave como:
astro blog templatepersonal blog starterportfolio blog theme
1.2 Filtrar por lenguaje (recomendado: Astro)
En la barra lateral izquierda, selecciona Language: Astro. Los blogs generados con el framework Astro cargan más rápido y son más amigables para SEO, ideales para un sitio de blog.
1.3 Criterios de selección
Al elegir un proyecto, fíjate en los siguietnes puntos:
- ⭐ Número de Stars: cuanto más alto, más popular es el proyecto
- 📅 Actualización reciente: garantiza que el proyecto se mantiene activamente
- 📖 Completitud del Readme: prioriza los que incluyen instrucciones detalladas de despliegue
💡 Proyectos recomendados: la biblioteca oficial de temas de Astro, o busca palabras clave como
astro-paper,astro-blog-template, etc.
📥 Paso 2: obtener el código fuente
2.1 Copiar el enlace del repositorio
Entra en el repositorio de GitHub seleccionado, haz clic en el botón verde Code y copia el enlace HTTPS o SSH.
2.2 Clonar en local
git clone <enlace-del-repositorio-copiado>
2.3 Abrir con el IDE
Abre la carpeta del proyecto con VS Code u otro editor de código.
✏️ Paso 3: personalización
3.1 Consultar el README
Abre el archivo README.md en la raíz del proyecto para conocer:
- Estructura del proyecto
- Comandos de instalación de dependencias
- Forma de iniciar en local
- Comandos de compilación
3.2 Vista previa local (recomendado)
Instala primero las dependencias y arranca la vista previa local para ver los cambios en tiempo real:
npm install
npm run dev
Después abre en el navegador http://localhost:4321 para previsualizar el sitio.
3.3 Modificar el contenido
Adapta los siguientes elementos según tus necesidades:
- Nombre/título del sitio
- Avatar o imagen de portada
- Página «Acerca de»
- Contenido de los artículos
🔗 Paso 4: subir a tu propio repositorio de GitHub
4.1 Eliminar el historial de Git original
Borra la carpeta .git del proyecto (en Windows es necesario activar la visualización de archivos ocultos):
rm -rf .git
4.2 Inicializar un nuevo repositorio
git init
git add .
git commit -m "primer commit"
4.3 Crear y subir al repositorio remoto
Crea un nuevo repositorio en GitHub (sin marcar la opción de añadir README) y ejecuta:
git remote add origin https://github.com/tu-usuario/nombre-del-repo.git
git branch -M main
git push -u origin main
☁️ Paso 5: desplegar en Cloudflare Pages
5.1 Registrarse / iniciar sesión en Cloudflare
Accede a Cloudflare; se recomienda iniciar sesión directamente con la cuenta de GitHub para facilitar la autorización posterior.
5.2 Configurar el idioma (opcional)
Tras iniciar sesión, haz clic en tu avatar en la esquina superior derecha → Idioma → selecciona el idioma de tu preferencia.
5.3 Entrar en la página de Pages
Menú lateral → Workers y Pages → haz clic en la pestaña Pages.
5.4 Crear un nuevo proyecto
En la esquina superior derecha, haz clic en Crear → elige Pages → Conectar a Git.
5.5 Autorizar y seleccionar el repositorio
- La primera vez es necesario autorizar la cuenta de GitHub
- Selecciona el repositorio del blog que acabas de subir
5.6 Configurar los parámetros de compilación
Consulta el comando de compilación en el README.md del proyecto. Configuración habitual:
| Parámetro | Valor de ejemplo |
|---|---|
| Comando de compilación | pnpm run build |
| Directorio de salida | dist |
| Versión de Node | 18 o 20 |
⚠️ Aviso: los comandos exactos dependen del README de tu proyecto, ya que pueden variar entre plantillas.
5.7 Desplegar
Haz clic en Guardar y desplegar y espera entre 1 y 2 minutos; Cloudflare completará automáticamente la compilación y el despliegue.
🎉 Paso 6: acceder a tu blog
Una vez finalizado el despliegue, Cloudflare generará un dominio gratuito con extensión .pages.dev, al que podrás acceder haciendo clic directamente.
Vincular un dominio personalizado (opcional)
- En los ajustes del proyecto de Pages, selecciona Dominio personalizado
- Introduce tu dominio y añade el registro CNAME según las indicaciones
📝 Actualizar artículos posteriormente
Para publicar nuevos artículos a partir de ahora solo necesitas:
- Crear un archivo
.mdo.mdxnuevo en el directorio localposts/ocontent/blog/ - Hacer push del código a GitHub
- Cloudflare Pages detectará automáticamente los cambios y volverá a desplegar
git add .
git commit -m "nuevo articulo del blog"
git push
🔗 Recursos
- GitHub
- Cloudflare Pages
- Documentación oficial de Astro
- Biblioteca de temas de Astro