Skip to main content

Quick Start

Prerequisites

  • Node.js 18+ installed
  • Tagada Studio open in your browser (CRM embedded or standalone)
No API key or store ID is needed. The MCP server connects directly to your open Studio editor via WebSocket — it doesn’t call any TagadaPay API.

Setup for Cursor

Add this to .cursor/mcp.json in your project (or in your global Cursor settings):
{
  "mcpServers": {
    "tagada-studio": {
      "command": "npx",
      "args": ["-y", "@tagadapay/studio-mcp", "--stdio"]
    }
  }
}
Cursor will start the MCP server automatically when you open the project.

Setup for Claude Desktop

Add this to your Claude Desktop config:
  • macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
  • Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "tagada-studio": {
      "command": "npx",
      "args": ["-y", "@tagadapay/studio-mcp", "--stdio"]
    }
  }
}
Restart Claude Desktop after saving.

Setup for Claude Code

Add the MCP server with the SSE transport:
claude mcp add --transport sse tagada-studio http://localhost:14333/sse
Then start the server manually (or in a separate terminal):
npx @tagadapay/studio-mcp

Setup for Windsurf

Add this to your Windsurf MCP config:
{
  "mcpServers": {
    "tagada-studio": {
      "command": "npx",
      "args": ["-y", "@tagadapay/studio-mcp", "--stdio"]
    }
  }
}

Manual start (any MCP client)

If your tool doesn’t auto-start MCP servers, run it manually:
npx @tagadapay/studio-mcp
The server starts on port 14333 by default with an SSE endpoint at /sse. Configure your MCP client to connect to http://localhost:14333/sse.

Verify the connection

1. Check the MCP server

Visit the /health endpoint in your browser (e.g., http://localhost:14333/health). You should see:
{
  "status": "ok",
  "server": "tagada-studio-mcp",
  "studioConnected": true
}
If studioConnected is false, make sure Tagada Studio is open in your browser.

2. Check Studio

When connected, you’ll see a green Agent badge in the Studio toolbar:
Agent

Your first edit

With both sides connected, ask the agent:
“Show me the page structure”
The agent will call view_tree and display the node hierarchy. Then try:
“Change the main heading to ‘Hello World’”
You’ll see the heading update live on the Studio canvas.

Multi-client support

The MCP server supports multiple Studio clients connected at the same time. If you have Studio open both in the CRM (embedded) and standalone, both will receive changes and stay in sync.

Options

OptionDefaultDescription
--stdioUse stdio transport (for Cursor, Claude Desktop, Windsurf)
--port <port>14333HTTP/WebSocket port
--helpShow help

Custom WebSocket URL

By default, Studio connects to the MCP server running on your machine. To use a different URL (e.g., when using a tunnel), add ?agentWs=ws://your-url/ws to the Studio URL.

Next steps