editor/ — drop-in copy of the editor scaffold from fe-shopify-client/app/editor. Components, config, theme, Shopify client/queries/hooks/contexts, plugin-ai vendor css.
app.schema.json — source of truth for every page in the demo. Shape: { "/": { root, content }, "/about": { ... }, ... }. The save endpoint writes back to this file.
app/[[...path]]/page.tsx — view route. Reads the schema and mounts <Render>.
app/edit/[[...path]]/page.tsx — edit route. Reads the schema and mounts <Editor>.
app/api/save-schema/route.ts — POST { route, data } → patches app.schema.json on disk.
app/api/chat/route.ts — aiPlugin endpoint. Uses the Vercel AI Gateway (AI_GATEWAY_API_KEY) to talk to Claude, with the editor + Shopify tool surface (updatePage, searchProducts, etc.).

Run

cp .env.local.example .env.local   # optional — defaults to mock.shop
yarn install
yarn dev   # → http://localhost:3001

View any route: http://localhost:3001/, /about, /products/handle, etc.
Edit any route: http://localhost:3001/edit, /edit/about, etc.
404 in view mode means the route isn't in app.schema.json yet — add it via the editor's New page button.

Shopify

Defaults to the public mock.shop storefront (no token needed) so commerce blocks render demo data immediately. Override via NEXT_PUBLIC_SHOPIFY_DOMAIN and NEXT_PUBLIC_SHOPIFY_STOREFRONT_ACCESS_TOKEN in .env.local.

AI

/api/chat mirrors the host app's pattern — pass a string-form model id (anthropic/claude-sonnet-4.6) and the AI SDK routes through the Vercel AI Gateway using AI_GATEWAY_API_KEY. Tools include the React Editor built-ins plus Shopify search/lookup helpers.