First Editable Content | cms0 Documentation

1) Define a practical first schema

Use one singleton and one collection so you can validate both editing patterns.


import { cms0 } from "@cms0/cms0";
 
type RootSchema = {
  HomePage: {
    title: string;
    subtitle: string;
    ctaLabel: string;
  };
  Features: {
    title: string;
    description: string;
  }[];
};
 
export const data = cms0<RootSchema>({
  apiConfig: {
    baseUrl:
      process.env.CMS0_API_BASEURL ?? import.meta.env.VITE_CMS0_API_BASEURL,
    key: process.env.CMS0_API_KEY ?? import.meta.env.VITE_CMS0_API_KEY,
  },
});

2) Publish the descriptor to admin


npx cms0 build

For continuous updates while you edit schema:


npx cms0 dev

3) Open admin and create content

Sign in to admin.
Open HomePage and fill fields.
Open Features and create one or more items.
Save.

4) Read the edited content in your app


const home = await data.HomePage();
const features = await data.Features();
 
console.log(home.title);
console.log(features[0]?.title);

5) Quick verification checklist

HomePage and Features are visible in admin
Saving in admin updates API responses
App fetch returns typed data without shape errors

Once this works, move to Content Modeling and Content Editing.