Laizy CMS
Integrations

Integrations

Overview of framework integrations for the Laizy CMS generated client.

Integrations

The Laizy generated client is a plain TypeScript module with no framework-specific dependencies. It works anywhere you can run JavaScript -- server-side, client-side, or at build time.

Available Integrations

Next.js

The most common integration pattern. Use the generated client in React Server Components for server-side rendering, in API routes for backend operations, or with client-side tokens for dynamic content.

Next.js Integration Guide

React

For React applications that are not using Next.js (Vite, Create React App, Remix, etc.), the client works in both server and client contexts.

React Integration Guide

How It Works

All integrations follow the same pattern:

  1. Create a ManagementClient with your base URL, API token, and project ID
  2. Create a LaizyClient by passing in the management client
  3. Query content using the generated methods (findMany(), findById(), count())
import { LaizyClient } from './generated/laizy';
import { ManagementClient } from '@/lib/management-client';

const managementClient = new ManagementClient({
  baseUrl: process.env.NEXT_PUBLIC_LAIZY_BASE_URL!,
  apiToken: process.env.NEXT_PUBLIC_LAIZY_TOKEN!,
  projectId: 'your-project-id',
});

const client = new LaizyClient(managementClient);
const posts = await client.blogPost.findMany();

Authentication Patterns

Different integration contexts require different token types:

ContextToken TypeScope
Server ComponentsAdmin or Frontendadmin or content:read
API RoutesAdminadmin
Client-Side RenderingFrontendcontent:read
Static Site GenerationAdmin or Frontendadmin or content:read
CLI / ScriptsAdminadmin

Frontend tokens are safe to expose in client-side code because they only have read access to published content. Admin tokens should only be used server-side.

Client Singleton Pattern

For server-side usage, create a single client instance that can be shared across requests:

// lib/cms.ts
import { LaizyClient } from '@/generated/laizy';
import { ManagementClient } from '@/lib/management-client';

const managementClient = new ManagementClient({
  baseUrl: process.env.NEXT_PUBLIC_LAIZY_BASE_URL!,
  apiToken: process.env.LAIZY_API_TOKEN!,
  projectId: process.env.LAIZY_PROJECT_ID!,
});

export const cms = new LaizyClient(managementClient);

Then import it anywhere:

import { cms } from '@/lib/cms';

const posts = await cms.blogPost.findMany();

Next Steps

On this page