Migrate

Wire Focus:CMS into your existing site.

Each recipe lists the minimum viable integration for that stack — the pieces you must add and the pieces you can defer. All recipes share the same data layer (Supabase content rows) and the same in-page editor chrome.

• Reference stack

  Next.js

  App Router or Pages Router. Static export or SSR. The reference theme runs on Next 14 App Router with output: export.

  Read the recipe →

• 30-minute migration

  React (Vite / CRA)

  Single-page React apps. Mount FocusCMSProvider in your root, wrap fields with the editable primitives, save through the Supabase adapter.

  Read the recipe →

• Most common

  Plain HTML / CSS

  Static HTML pages — typical Squarespace or Webflow exports. Wrap each page body in <EditableRawHtml> via a one-page Next.js shell.

  Read the recipe →

• API-friendly

  Node / Express

  Server-rendered Express apps. Replace template render with an EditableRawHtml React island, or migrate page content into focus_cms_content.

  Read the recipe →

• Coexists with PHP

  PHP / Laravel / WordPress

  PHP-rendered pages. Inject the editor as a Next.js island on a subdomain, or migrate templates to a static Next export pointed at the same DB.

  Read the recipe →

• Islands-friendly

  Astro

  Astro pages render to HTML at build time. Add a React island per editable surface; the rest of the page stays as plain HTML.

  Read the recipe →