Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.frontic.com/llms.txt

Use this file to discover all available pages before exploring further.

Let your editor’s AI agent talk to Frontic directly. Frontic runs two MCP servers your agent can connect to — the project MCP for reading and writing your Frontic project, and the docs MCP for querying Frontic documentation. Any MCP-compatible client works: Claude Code, Claude Desktop, Cursor, and any other editor that speaks the protocol. With the project MCP connected, your coding agent can understand and control the project alongside the code it’s writing:
  • explore project configuration — domains, scopes, regions, locales — to see what it’s building against
  • create, update, and delete blocks, listings, and pages
  • create and manage Data Storages, including their schema fields
  • search Data Storage records and Data Feed records to see real data
  • read and edit Data Sync configurations, and preview Value Composer transforms on sample records to debug mappings without round-tripping to the admin app
  • on Plus plans, read and author Context Base documents (Skills, Rules, Commands)
The docs MCP is read-only and needs no auth — add it alongside the project MCP and your agent can answer “how does X work?” questions without you leaving the editor.

​
The two MCP servers

Project MCP

https://mcp.frontic.com/mcp — the full project surface. Lets your agent read and write blocks, listings, pages, inspect Data Storages, preview Value Composer output, and so on. OAuth-authenticated, bound to your Frontic account.

Docs MCP

https://docs.frontic.com/mcp — read-only access to Frontic documentation. Your agent can search the docs and pull in the relevant page when it needs to answer a how-to question. No authentication required.
Both are standalone MCP servers. You can install one or both — they don’t depend on each other. Most editor setups add both so the agent can both query the docs and act on your project.

​
Quick setup with the CLI

The fastest way to wire up either or both MCP servers is the frontic mcp init command. It detects your client, writes the right config to the right place, and asks whether you want both servers, tools only, or docs only: 
frontic mcp init --client cursor
Terminal showing the frontic mcp init command with a selector for Tools & Docs, Tools only, or Docs only
Supported clients: cursor, claude (Claude Code), windsurf, vscode, codex. The command merges with any existing MCP config rather than overwriting it. After setup, restart your client. On the first call to the project MCP, you’ll be prompted to authenticate via OAuth. The docs MCP needs no auth.
Frontic OAuth consent screen listing the projects the MCP client will have access to and an Authorize button
See the Frontic CLI reference for the per-client config paths and the full option list.

​
Manual configuration

If you’d rather write the config yourself, here’s the JSON to add: 
{
  "mcpServers": {
    "frontic-tools": {
      "type": "http",
      "url": "https://mcp.frontic.com/mcp"
    },
    "frontic-docs": {
      "type": "http",
      "url": "https://docs.frontic.com/mcp"
    }
  }
}
Drop it into your client’s MCP config file. The accordions below show where each client expects the file.

​
Client-specific configuration

Add to .mcp.json at your project root — Claude Code reads project MCP config from this file:
{
  "mcpServers": {
    "frontic-tools": {
      "type": "http",
      "url": "https://mcp.frontic.com/mcp"
    },
    "frontic-docs": {
      "type": "http",
      "url": "https://docs.frontic.com/mcp"
    }
  }
}
Restart Claude Code and run the /mcp command to confirm both servers are connected. The first project MCP call triggers the OAuth flow.
Claude Code MCP panel showing frontic and frontic-docs servers with connected status
Edit the Claude Desktop config file:
  • macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
  • Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "frontic-tools": {
      "type": "http",
      "url": "https://mcp.frontic.com/mcp"
    },
    "frontic-docs": {
      "type": "http",
      "url": "https://docs.frontic.com/mcp"
    }
  }
}
Restart Claude Desktop. Both Frontic servers should appear in the MCP tools list at the top of your chat.
Add to Cursor’s MCP settings — .cursor/mcp.json in your project root, or Cursor’s global settings:
{
  "mcpServers": {
    "frontic-tools": {
      "type": "http",
      "url": "https://mcp.frontic.com/mcp"
    },
    "frontic-docs": {
      "type": "http",
      "url": "https://docs.frontic.com/mcp"
    }
  }
}
Reload Cursor. Both servers will appear in the MCP panel under Cursor’s settings.
frontic mcp init supports these clients directly. Config paths:
ClientConfig path
Windsurf~/.codeium/windsurf/mcp_config.json (global)
VS Code.vscode/mcp.json (project-local)
Codex~/.codex/config.toml (global, TOML format)
Run frontic mcp init --client <windsurf|vscode|codex> to write the config, or drop the JSON above into the file yourself. For Codex, the TOML equivalent goes in the [mcp_servers] section.
Any editor that supports the Model Context Protocol can connect. Follow your editor’s MCP setup documentation — the URLs are the only Frontic-specific piece.

​
First things to try

Have your agent list your projects and inspect the main one

Good first call — confirms the connection works and gives your agent an overview of what’s there.

Ask the agent to map out your Data Storages and their fields

Gets your agent a mental model of the semantic layer before it starts building anything.

Let the agent build a Search Listing for products with filters and sorting

The agent creates the listing, wires the filters, and returns the configuration. You review and approve.

Look up how Request Context resolves from a domain via the docs MCP

With the docs MCP connected, the agent queries the Frontic documentation and answers with the relevant section — without leaving your editor.

Have the agent plan and set up a basic storefront end to end

Multi-step prompt. The agent plans the setup, confirms the plan with you, then runs through the creation steps. The full catalog of what the project MCP exposes is in the Frontic Tools reference — but most day-to-day work never touches the catalog directly because prompts like the ones above are enough.

​
Permissions and security

The project MCP authenticates via OAuth against your Frontic account. The token the agent uses carries your account’s permissions — whatever role you have on a project in the admin app, the MCP can do on that project, and nothing more. If you’re a Viewer, the agent can read but not write. If you’re an Admin, the agent can do everything you can do. A few consequences worth knowing:
  • The agent picks a project explicitly. Most tools take a project ID as a parameter. A typical first call is list_projects; after that, ask your agent to switch projects whenever you need it to work against a different one.
  • Per-call approvals are your MCP client’s job. Claude Code, Cursor, and other clients have their own tool-use approval UI — that’s where you approve or reject individual calls before they hit Frontic. Frontic doesn’t inject anything on top of that; the permission layer is the OAuth token.
The docs MCP is read-only end to end — no auth, no permissions to worry about.

​
Combining MCP with the CLI

MCP is the agent-facing surface. The Frontic CLI is the developer-facing surface. They compose naturally:

Agent creates stack resources via MCP

You describe what you need; the project MCP creates blocks, listings, pages in your Frontic project. Everything lands in develop immediately.

You regenerate the Client SDK via CLI

Run frontic generate from your terminal. The CLI pulls the current project API and writes a typed client into .frontic/.

Agent writes frontend code against the SDK

The agent now has a typed Client SDK to build against. It writes pages, components, and data calls against the API surface it created.

Review and type-check

Review the diff and run your type-checker against the regenerated client. Any drift from the actual API shape surfaces as a type error before you ship.

Preview and ship

Create a preview release and test the full stack on a PR preview deploy — the frontend builds against the preview snapshot, so you can rewrite straight to the new API shape without keeping legacy paths around. Promote, deploy. See the Release Flow for the full picture.

​
Troubleshooting

Some clients cache an old server definition. Remove the frontic entry from your MCP config, reload the client, add it back, and try again. OAuth should prompt the first time a tool is called.
Ask your agent to list my Frontic projects and switch explicitly to the one you want — most tools take a project ID per call.
Your Frontic account’s role on the project doesn’t cover that operation, or your OAuth token expired. Check your role in the admin app, re-authenticate, and retry.

Project Context

What flows from Frontic into your editor — MCP is the live tool surface.

Frontic CLI

Generate the typed SDK, sync your Context Base, and manage project state from the command line.

Frontic Tools reference

The full catalog of tools the project MCP exposes.