Crea 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 local de medios, por lo que puedes completar el tutorial sin una cuenta en la nube.

Requisitos previos

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

node --version

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

Crear el sitio

Crea my-emdash-site a partir de la plantilla Node.js Starter:
```
npm create emdash@latest my-emdash-site -- --template node:starter --pm npm --yes
```
La elección explícita node:starter crea un sitio de propósito general con Posts y Pages. El scaffolder instala dependencias y escribe un EMDASH_ENCRYPTION_KEY generado en el archivo .env ignorado por git.

Si la instalación de dependencias falla, los archivos del proyecto permanecen en su lugar. Ejecuta el comando de reintento impreso por el scaffolder antes de continuar.
Entra en el directorio del proyecto e inicia el servidor de desarrollo:
```
cd my-emdash-site
npm run dev
```
Mantén este terminal abierto. Astro imprime la URL del sitio local, 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 una Tagline opcional. Deja Include sample content seleccionado para que el tutorial comience con el post Welcome y la página About de la plantilla, luego selecciona Continue.
Introduce Your Email y un Your Name opcional, luego selecciona Continue.
Registra un passkey cuando el navegador abra su solicitud de credenciales. Después del 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, luego abre Welcome.
Cambia el título a Hello from EmDash, luego selecciona Save.
Selecciona Publish changes para que el borrador guardado se convierta en la versión mostrada a 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 Node.js. También registra React para el panel de administración y le da a EmDash una base de datos SQLite y un directorio para medios subidos. El archivo src/live.config.ts conecta ese contenido respaldado por base de datos a las Live Content Collections de Astro.

La página de inicio luego consulta 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 el asistente de configuración aplicó. Durante el desarrollo local, EmDash lee ese modelo y actualiza emdash-env.d.ts, para que tu editor pueda verificar los nombres de colecciones 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 entender cómo estas partes trabajan juntas. Para añadir EmDash a un sitio que ya existe, sigue Añadir EmDash a un proyecto Astro existente. La guía de consulta de contenido cubre filtros, paginación, borradores y manejo de errores. Cuando el sitio esté listo para salir de tu máquina, despliégalo en Cloudflare Workers o Node.js. La guía de la biblioteca de medios explica subidas, campos de medios, reemplazo y eliminación.