Crear tu primer sitio EmDash | EmDash CMS Everything

Este tutorial crea un sitio Node.js a partir de la plantilla Starter. El resultado usa SQLite y almacenamiento de medios local, de modo que puedes completar el tutorial sin una cuenta en la nube.

Si ya tienes un sitio Astro, sigue Añadir EmDash a un proyecto Astro existente en su lugar.

Requisitos previos

Instala Node.js 22.16 o posterior y npm. Comprueba la versión instalada de Node.js antes de continuar:

node --version

El comando debe informar v22.16.0 o una versión posterior.

Generar el sitio

Inicia el generador interactivo:
npm
```
npm create emdash@latest
```
pnpm
```
pnpm create emdash@latest
```
yarn
```
yarn create emdash
```
bun
```
bun create emdash@latest
```
Elige las siguientes opciones cuando se te pida:
- Project name: my-emdash-site
- Where will you deploy? Node.js
- Which template? Starter
- Which package manager? Mantén el gestor de paquetes detectado a partir del comando del paso 1.
- Install dependencies? Yes
Estas opciones crean un sitio Node.js de propósito general con Posts y Pages. El generador también escribe un EMDASH_ENCRYPTION_KEY generado en el archivo .env ignorado por git.

Si falla la instalación de dependencias, los archivos del proyecto permanecen. Ejecuta el comando de reintento que imprime el generador antes de continuar.
Entra en el directorio del proyecto e inicia el servidor de desarrollo:
npm
```
cd my-emdash-site
npm run dev
```
pnpm
```
cd my-emdash-site
pnpm dev
```
yarn
```
cd my-emdash-site
yarn dev
```
bun
```
cd my-emdash-site
bun dev
```
Mantén esta terminal abierta. Astro imprime la URL local del sitio, normalmente http://localhost:4321/.

Completar la configuración

Abre http://localhost:4321/_emdash/admin/. Un sitio nuevo redirige al asistente de configuración.

Introduce un Site Title y un Tagline opcional. Deja Include sample content seleccionado para que el tutorial empiece con el post Welcome y la página About de la plantilla, y luego selecciona Continue.
Introduce Your Email y un Your Name opcional, y luego selecciona Continue.
Registra una passkey cuando el navegador abra su petición de credenciales. Tras el registro, selecciona Open the dashboard.

El panel se abre con Posts y Pages en la navegación. El asistente de configuración ha aplicado el modelo de contenido y el contenido de ejemplo de la plantilla Starter a la base de datos SQLite local.

Publicar una edición

Abre Posts y luego Welcome.
Cambia el título a Hello from EmDash y luego selecciona Save.
Selecciona Publish changes para que el borrador guardado se convierta en la versión que ven los visitantes.
Abre http://localhost:4321/ en otra pestaña. La página de inicio lista Hello from EmDash.

La plantilla Starter llama a getEmDashCollection("posts") cuando Astro renderiza la página de inicio. Recargar la página lee la versión publicada de EmDash en tiempo de ejecución.

Cómo funciona el sitio generado

El scaffold produce un proyecto Astro normal con EmDash conectado en tres lugares.

astro.config.mjs habilita el renderizado en servidor y el adaptador de Node.js. También registra React para el panel de administración y da a EmDash una base de datos SQLite y un directorio para los medios subidos. El archivo src/live.config.ts conecta ese contenido respaldado por la base de datos con las Live Content Collections de Astro.

La página de inicio consulta entonces la colección posts. Su consulta es equivalente a la siguiente parte de la página generada:

---
import { getEmDashCollection } from "emdash";

const { entries: posts, cacheHint } = await getEmDashCollection("posts", {
	orderBy: { published_at: "desc" },
});

if (Astro.cache?.enabled) Astro.cache.set(cacheHint);
---

<ul>
	{posts.map((post) => <li>{post.data.title}</li>)}
</ul>

seed/seed.json define las colecciones Posts y Pages, sus campos y el contenido de ejemplo que aplicó el asistente de configuración. Durante el desarrollo local, EmDash lee ese modelo y actualiza emdash-env.d.ts, de modo que tu editor pueda comprobar nombres de colección y campos en el código de consulta.

El .env generado suministra la clave de cifrado en tiempo de ejecución. Es independiente del archivo SQLite que almacena el modelo y el contenido.

Siguientes pasos

Lee Arquitectura para ver cómo encajan estas partes. Para añadir EmDash a un sitio que ya existe, sigue Añadir EmDash a un proyecto Astro existente. La guía Consultar contenido cubre filtros, paginación, borradores y manejo de errores. Cuando el sitio esté listo para dejar tu máquina, despliégalo en Cloudflare Workers o Node.js. La guía Biblioteca de medios explica cargas, campos de medios, reemplazo y eliminación.