Next.js renderer for json-render that turns JSON specs into full Next.js applications with routes, layouts, SSR, and metadata. Use when working with @json-render/next, building Next.js apps from JSON specs, or creating AI-generated multi-page applications.

@json render/next Next.js renderer that converts JSON specs into full Next.js applications with routes, pages, layouts, metadata, and SSR support. Quick Start 1. Define Your Spec 2. Create the App 3. Wire Up Route Files Key Concepts NextAppSpec The top level spec defines an entire Next.js application: metadata : Root level SEO metadata (title template, description, OpenGraph) layouts : Reusable layout element trees (each must include a Slot component) routes : Route definitions keyed by URL pattern state : Global initial state shared across all routes Route Patterns Routes use Next.js URL conventions: "/" home page "/about" static route "/blog/[slug]" dynamic segment "/docs/[...path]" catch all segment "/settings/[[...path]]" optional catch all segment Layouts Layouts wrap page content. Every layout MUST include a Slot component where page content will be rendered. Layouts are defined once in spec.layouts and referenced by routes via the layout field. Built in Components Slot : Placeholder in layouts where page content is rendered Link : Client side navigation link (wraps next/link ) Built in Actions setState : Update state value. Params: { statePath, value } pushState : Append to array. Params: { statePath, value, clearStatePath? } removeState : Remove from array by index. Params: { statePath, index } navigate : Client side navigation. Params: { href } Data Loaders Server side async functions that run in the Server Component before rendering. Results are merged into the page's initial state. SSR Pages are server rendered automatically. The createNextApp Page component is an async Server Component that: 1. Matches the route from the spec 2. Runs server side data loaders 3. Generates metadata 4. Passes the resolved spec to the client renderer for hydration Entry Points @json render/next Client components (NextAppProvider, PageRenderer, Link) @json render/next/server Server utilities (createNextApp, matchRoute, schema) API Reference Server Exports ( @json render/next/server ) createNextApp(options) Create Page, generateMetadata, generateStaticParams schema Custom schema for Next.js apps (for AI catalog generation) matchRoute(spec, pathname) Match a URL to a route spec resolveMetadata(spec, route) Resolve metadata for a route slugToPath(slug) Convert catch all slug array to pathname collectStaticParams(spec) Collect static params for all routes Client Exports ( @json render/next ) NextAppProvider Context provider for registry and handlers PageRenderer Renders a page spec with optional layout NextErrorBoundary Error boundary component NextLoading Loading state component NextNotFound Not found component Link Built in navigation component (wraps next/link)