@instant-cms/next
v1.0.8
Published
Instant CMS – Next.js-Integration (App Router Route Handler, Pages Router API Handler, Server-Helper)
Maintainers
mf_7Readme
@instant-cms/next
Next.js-Integration für Instant CMS – ein selbst gehostetes Mini-CMS für bestehende Next.js- und React-Projekte.
Route Handler für den App Router (createCmsRouteHandlers,
createAdminRouteHandler), API-Handler für den Pages Router
(createCmsPagesApiHandler) und serverseitiger Content-Zugriff über
createCms().get(...).
Installation
npm install @instant-cms/nextDer einfachste Einstieg ist die CLI im Projektwurzelverzeichnis:
npx instant-cms initDokumentation: Getting Started · Architektur · Sicherheit
Lizenz: MIT
Admin-Modus unter /admin
// middleware.ts
import { createCmsMiddleware } from "@instant-cms/next/middleware";
export const middleware = createCmsMiddleware({ adminPath: "/admin" });
export const config = { matcher: ["/admin", "/admin/"] };Die Middleware liefert unter /admin die Startseite aus, damit das React SDK
(<CmsProvider admin>) dort den Login-Dialog öffnen kann – ohne separate
Admin-Seite. Der Import läuft bewusst über @instant-cms/next/middleware:
Middleware wird in der Edge-Runtime ausgeführt, die die Node-Abhängigkeiten
des Hauptmoduls nicht laden kann.
Inhalte serverseitig laden (App Router)
// app/layout.tsx – bleibt eine Server Component
import { CmsServerProvider } from "@instant-cms/next/provider";
import { cms } from "../lib/cms";
export default function RootLayout({ children }) {
return (
<html lang="de">
<body>
<CmsServerProvider cms={cms}>{children}</CmsServerProvider>
</body>
</html>
);
}Der Provider liest die Inhalte auf dem Server und gibt sie an den Client- Provider weiter – das erste HTML enthält damit bereits die CMS-Texte (kein Nachladen, korrekt für Suchmaschinen) und der Admin-Modus ist aktiviert.
Gelesen wird über Nexts Daten-Cache (Tag instant-cms:content), und
createCmsRouteHandlers verwirft diesen Tag nach jedem Speichern. Die Seiten
bleiben also statisch schnell und sind trotzdem sofort aktuell. Mit
<CmsServerProvider cms={cms} dynamic> wird stattdessen bei jeder Anfrage
gerendert – für Hosts ohne Revalidierung.