Docs

Manual Setup

Manual setup to make light-cms work on your Nextjs project. It is recommend you do not wrap the app inside src directory.

Create lightcms.config.ts

This acts as the file that stores the types, the admin credentials, and their roles

pnpm dlx light-cms@latest init

Setup db/index.ts and db/schema.s

Follow the documentation of drizzle with the database provider that you wish to integrate.

// the schema should follow this general structure
export const pages = sqliteTable("pages", {
  slug: text("slug").primaryKey(),
  title: text("title").notNull(),
  content: text("content", { mode: "json" }).notNull(),
});

export const logs = sqliteTable("logs", {
  id: text("id").primaryKey(),
  username: text("username").notNull(),
  pageSlug: text("page_slug").notNull(),
  timestamp: text("timestamp").notNull(),
  changes: text("changes", { mode: "json" }).notNull(),
});

Create drizzle.config.ts

// it will be different depending of the provider you are integration. Visit the drizzle docs
// https://orm.drizzle.team/docs/overview

import { defineConfig } from "drizzle-kit";

export default defineConfig({
  schema: "./db/schema.ts",
  out: "./migrations",
  dialect: "turso",
  dbCredentials: {
    url: process.env.TURSO_DATABASE_URL!,
    authToken: process.env.TURSO_AUTH_TOKEN!,
  },
});

Setup the env variables

It is recommended that you store the admin username and credentials as env variables and not as literal strings inside the lightcms.config.ts

Install the dependencies

// shadcn
pnpm dlx shadcn@latest add button input-group textarea select switch separator sidebar sonner sheet tooltip skeleton

// dependencies
pnpm add zod drizzle-orm @tanstack/react-form

// dev dependencies
pnpm add -D drizzle-kit

// addition -D @libsql/client or postgres depending on your db of choice

Enable cacheComponents

We need to enable cacheComponents to use light-cms

// next.config.ts
import type { NextConfig } from "next";

const nextConfig: NextConfig = {
  /* config options here */
  cacheComponents: true,
};

export default nextConfig;

Sync the db with the schema

pnpm drizzle-kit push