Next.js CMS para webs de clientes
Un CMS para Next.js en webs de clientes, escrito por tu agente
jtakeit es un CMS para Next.js basado en git para webs de clientes: tu agente compila un export estático en tu propio repositorio, el propietario edita tocando el texto y la plataforma opera formularios, reservas, hosting y dominio.
$ npx create-next-app@latest client-site --ts --app
$ cd client-site
# next.config.mjs: output 'export', basePath from SITE_URL
$ npm run build
$ ls dist
404.html _meta.json _next index.html robots.txt sitemap.xml
$ git push origin main
# then, over MCP: validate_catalogue → commit_and_build01/ lo que necesita
Lo que necesita un CMS para Next.js en webs de clientes
Un sitio de cliente hecho con Next.js necesita algo más que un sitio donde guardar textos. El propietario tiene que poder cambiar sus propios textos sin llamarte, y el sitio tiene que seguir recibiendo consultas, aceptando reservas y dejando que el cliente se vaya con sus datos.
Ediciones que no rompen el diseño
El propietario toca el texto de la página y solo rellena los campos que declara el catálogo. Sin botón de añadir página ni de añadir bloque, por diseño.
El contenido, en tu repositorio
Los textos publicados son JSON en el repositorio git que tienes tú. Cada guardado es un commit.
Formularios de consulta
Los formularios están protegidos contra el spam, y las consultas llegan a Telegram, al email o a la bandeja del panel.
Reservas de pago
El módulo de reservas envía las reservas pagadas directamente al Stripe del propio negocio.
Una vista previa antes de pagar
El cliente aprueba el sitio real, en una vista previa, antes de que se lance.
Una salida
Las consultas y las reservas se exportan en CSV y JSON. Exportar nunca exige una suscripción activa.
02/ git o api
¿Basado en git o un headless CMS para Next.js?
Un headless CMS guarda el contenido en su propia base de datos y lo sirve mediante una API, algo que encaja cuando un equipo de contenidos publica en una web, una app y más. Un sitio de cliente tiene un propietario y un sitio, así que jtakeit guarda sus textos en el repositorio, junto al código.
| Un headless CMS típico | jtakeit | |
|---|---|---|
| Contenido publicado | En la base de datos del CMS, obtenido por su API | JSON en tu repositorio |
| Cómo lo obtiene el build | Una llamada a la API desde el build o desde el servidor | Un archivo que la plataforma ensambla para cada build |
| Un guardado | Una actualización de registro | Un commit; los borradores quedan en la base de datos de la plataforma |
| Dónde edita el propietario | En una app de administración aparte | En la propia página, tocando su texto |
| Formularios, reservas, hosting | Fuera del CMS, añadidos por separado | Operados por la plataforma, con la facturación, las copias de seguridad y el dominio |
| El sitio tal como estaba en marzo | Depende del historial del CMS | Un solo comando de git |
03/ export estático
Next.js static export en jtakeit
La plataforma compila todos los sitios igual: ejecuta el build del proyecto y luego sirve la carpeta que ese build escribe. Next.js encaja como export estático: HTML escrito en tiempo de build, sin ningún servidor en marcha cuando alguien visita el sitio.
// next.config.mjs
const site = new URL(process.env.SITE_URL ?? 'http://localhost:3000/');
export default {
output: 'export', // static HTML, no server at request time
basePath: site.pathname.replace(/\/$/, ''), // '' live, '/p/<slug>' in preview
trailingSlash: true, // /about/index.html, not /about.html
images: { unoptimized: true },
};
// package.json — the platform runs `npm run build` and serves dist/
"scripts": { "build": "next build && rm -rf dist && cp -R out dist" }
// public/_meta.json — copied into dist/ with the rest of public/
{ "immutable": ["/_next/static/"] }// lib/jtk.ts — runs at build time, never in the browser
import { readFileSync } from 'node:fs';
const file = process.env.JTK_CONTENT_FILE;
export const published = file ? JSON.parse(readFileSync(file, 'utf8')) : null;
// data-jtk-path only when the platform asks for it
export const tap = (path: string) =>
process.env.PUBLIC_JTK_ANNOTATE ? { 'data-jtk-path': path } : {};
// app/page.tsx
<h1 {...tap('blocks[0].title')}>{hero.title}</h1>
// app/robots.ts
export const dynamic = 'force-static';
const site = process.env.SITE_URL!.replace(/\/?$/, '/');
export default function robots() {
return { rules: { userAgent: '*', allow: '/' },
sitemap: new URL('sitemap.xml', site).href };
}Definidas en cada build
SITE_URLla dirección del sitio: el host para el canonical y el sitemapPUBLIC_JTK_ANNOTATEsi está definida, marca cada campo que el propietario puede editarJTK_CONTENT_FILEdónde se ensambló el contenido publicado para que lo lea este build
Qué debe contener el build
- Una página propia para cada dirección: cada página en su propia carpeta, no un archivo HTML suelto junto a los demás.
- Assets que funcionen bajo la dirección de la vista previa. Una vista previa se sirve bajo una ruta propia, así que la ruta base sale de la dirección del sitio que define la plataforma.
- Una página 404, que el export estático escribe por ti.
- Un robots.txt que deje entrar a los rastreadores, y un sitemap en la dirección del sitio.
- Un canonical en ese host en cada página, y ningún noindex en ninguna parte: la plataforma rechaza un build que lo tenga.
- Una nota de caché que marque los assets con hash de Next como inmutables, para que se guarden en caché para siempre.
- El catálogo de lo que el propietario puede editar, escrito a mano o con tu propia herramienta y comprobado por la plataforma. Los formularios envían sus consultas a la plataforma.
04/ escrito por tu agente
Next.js, con tu agente montando el contrato
Astro es el scaffold que ofrece jtakeit. En Next.js no hay ningún starter que clonar: tú —o tu agente de IA, por ejemplo Claude Code a través del servidor MCP de jtakeit— organizas el proyecto según el contrato documentado, y la plataforma lo comprueba igual que cualquier otro sitio.
| Scaffold de Astro | Next.js static export | |
|---|---|---|
| Punto de partida | El scaffold de Astro de jtakeit | Tu propio proyecto Next.js |
| Catálogo | Generado y comprobado por la herramienta de catálogo del scaffold | Escrito a mano o con tu propia herramienta |
| Formularios y specimens | Incluidos | Los construyes tú; los formularios envían las consultas a la plataforma |
| Dependencias | Preinstaladas | Las instala tu build |
| Un build | Menos de un minuto | Unos 90 segundos |
Cómo funciona el flujo con Claude Code →
Cómo se declara la edición en el scaffold de Astro →
05/ cómo elegir
Cómo elegir el mejor CMS para webs de clientes en Next.js
Empieza por lo que el sitio tiene que hacer cuando alguien lo visita. Si necesita el servidor en tiempo de petición —regeneración estática incremental, rutas de API, middleware, server actions o páginas renderizadas en cada petición—, jtakeit no es la herramienta: solo sirve salida estática, con cualquier framework.
Si el sitio se puede compilar de antemano, la pregunta pasa a ser quién lo edita. jtakeit es para desarrolladores cuyos clientes deben poder cambiar sus propios textos —y nada más— sin llamarte, y que prefieren no operar ellos mismos formularios, reservas, facturación, copias de seguridad, hosting y el dominio.
¿No estás atado a Next.js? El Astro CMS para webs de clientes es el scaffold que ofrecemos y compila en menos de un minuto. Cómo funciona la edición basada en git con cualquier generador se explica en la página del CMS estático para webs de clientes.
06/ preguntas
Preguntas sobre el CMS para Next.js
- ¿jtakeit es compatible con Next.js?
- Sí, como export estático. La plataforma ejecuta el build del proyecto y sirve la carpeta que este escribe, así que un sitio Next.js encaja cuando se compila de antemano como export estático y se copia a esa carpeta. Astro es el scaffold que ofrece jtakeit; en Next.js organizas tú el proyecto según el mismo contrato documentado.
- ¿Puedo usar el App Router?
- El App Router puede generar un static export siempre que nada del sitio necesite un servidor en tiempo de petición: sin regeneración estática incremental, sin route handlers ni server actions que se ejecuten en cada petición, sin middleware y sin renderizado que dependa de la petición. Es un límite del propio static export de Next.js, así que contrasta tu app con su documentación sobre static export.
- ¿Hay un starter oficial de Next.js?
- No. No hay ningún starter, plugin ni SDK de Next.js. El scaffold que ofrece jtakeit es Astro. En Next.js tú —o tu agente de IA— montas el contrato documentado: el build escribe en la carpeta que sirve la plataforma, lee los textos publicados de un archivo que prepara la plataforma, y el catálogo de lo que el propietario puede editar se escribe a mano o con tu propia herramienta y lo comprueba la plataforma.
- ¿Cuánto tarda un build?
- Unos 90 segundos para un sitio que no usa el scaffold de Astro, porque el build instala tus propias dependencias. El scaffold de Astro trae las dependencias preinstaladas y compila en menos de un minuto.
- ¿Cómo edita el cliente un sitio Next.js?
- Tocando el texto de la página. El catálogo del sitio declara qué campos puede rellenar el propietario y, cuando la plataforma lo pide, tus páginas marcan esos campos. Cada guardado es un commit en tu repositorio, y el siguiente build lee los textos publicados del archivo que prepara la plataforma.
- ¿Cuánto cuesta?
- Registrarse, crear y ver la vista previa es gratis. Cuando un sitio se lanza pagas un precio mayorista por sitio activo, al mes o al año, y cobras a tu cliente tu propio precio; igual en Next.js que en Astro. Las cifras están en la página de precios.
07/ prueba gratis
Pruébalo con un sitio de cliente real
Regístrate en el panel y crea tu primer sitio de cliente, con el scaffold de Astro o como export estático de Next.js. Solo pagas un precio mayorista cuando un sitio se lanza.
Prueba gratisadmin.jtakeit.com
- Gratis hasta que un sitio se lanza
- Después, un precio mayorista por sitio activo, desde €5 al mes
- El código se queda en tu repositorio git