Skip to main content
Avocado Studio manages websites as sites — each with its own pages, blocks, theme, and publishing target. Before you can edit anything, you need at least one site registered with the orchestrator. There are three ways to get there. Pick whichever matches your trust level for AI and your appetite for hands-on integration work.
Next.js only (officially tested). Avocado Studio is currently built and tested against Next.js 15+ (App Router). Every path on this page assumes your site is — or will be — a Next.js project. If you’re on Astro / Remix / SvelteKit / Hono / etc., the SDK ships framework-agnostic /core primitives you can wire up by hand — see Non-Next.js Integration. The patterns are real and the primitives work, but you’ll be a first mover and should expect to file bugs.

Use our Onboarding agent

A built-in AI agent that runs end-to-end inside the editor. Three modes: Migrate a public URL, Integrate an existing Next.js repo, or Create from a description. Fastest path; early-stage — treat its first pass as a draft.

Use your own coding agent

Hand the integration to Codex, Claude Code, Cursor, or any agent in your IDE. We provide a copy-paste prompt and a verification checklist; the agent already knows your codebase.

Do it by hand

Skip AI entirely. Follow our integration docs, write the code yourself. ~30 minutes for a vanilla Next.js 15 App Router site. Every line is yours, no surprises.
All three paths produce the same end state: a Next.js site registered with the orchestrator, with pages, theme, and a wired-in Site SDK, editable from the Content Studio.

​
Which approach should I pick?

​
Option 1 — Onboarding agent

The Onboarding agent is an AI agent in the editor’s Sites page. Pick one of three modes from your first message:
This is early — set expectations. The Onboarding agent works well for simple landing pages and small Next.js repos. Complex sites (heavy interactivity, custom CMS schemas, deep routing, design systems with non-standard tokens) usually need a few iterations of cleanup in the editor or by hand. Treat the first pass as a draft you’ll refine, not a finished site. If you need pixel-perfect output on the first run, choose option 2 or 3.
Claude only. The Onboarding agent runs exclusively on Anthropic Claude — either through your Claude subscription (CLI backend, $0/token) or an ANTHROPIC_API_KEY (SDK backend, pay-per-token). An OpenAI key alone won’t work for this path. The editor’s per-edit chat (the AI you talk to after a site exists) supports OpenAI or Anthropic. If you need a different model for onboarding, use Bring your own coding agent with any agent you like.
→ Full reference: Onboarding agent (modes, prerequisites, CLI vs SDK billing, troubleshooting)

​
Option 2 — Bring your own coding agent

If you’re already running a coding agent in your IDE (Codex, Claude Code, Cursor, or others), you don’t need to switch to ours. We provide a copy-paste prompt and a verification checklist; your agent does the work in your existing review flow. When this beats the Onboarding agent:
  • Your agent already has full context on your codebase, conventions, and history
  • You want changes to flow through your existing PR / commit / CI process
  • Your project has unusual structure (monorepo, custom build, non-standard routing) where our agent might land changes in the wrong place
  • Compliance / data residency reasons — work happens in your environment, not ours
→ Full reference: Bring your own coding agent (prompt template, verification checklist, troubleshooting)

​
Option 3 — Manual integration

No AI involved. You read the integration guides, write the code, register the site. ~30 minutes for a vanilla Next.js 15 App Router project. The two SDK helpers (createEditorApiHandler and createSitePage) do most of the heavy lifting; you wire them in. When this is the right call:
  • You want to understand every change yourself
  • You need pixel-perfect output on the first run
  • Your project is unusual enough that an AI agent would likely make a mess
  • You’re building muscle memory for the SDK and want to read the contracts directly
→ Full reference: Manual integration (prerequisites, step-by-step, custom blocks, Puck mode)

​
After your site is in

Once a site exists in the orchestrator, the rest of the docs apply regardless of which path you took: