Windsurf
Windsurf, now Devin Desktop, can call a remote MCP server from the editor. Use the hosted Vibe Coding Plan URL when you want the same token as Lovable and Bolt. Use the local npx server when the editor should start the process itself.
Two ways to connect, one account
Lovable, Bolt, v0, Replit, and Base44 can only reach a public URL. Windsurf can do that and it can also spawn a local process. If you already use the hosted server in a browser builder, use the hosted URL here too. The projects you create in Windsurf show up when Lovable calls list_projects, because both calls use your user.
The editor has two agents in the current docs. Devin Local is the default for new tabs and reads ~/.config/devin/mcp_config.json on macOS and Linux, or %APPDATA%\devin\mcp_config.json on Windows. A project copy lives at .devin/mcp_config.json, and a personal project copy that should stay out of git is .devin/mcp_config.local.json. Cascade, the older agent, opens its file from the Cascade panel: the MCPs menu, then Open MCP config file. Older guides still mention ~/.codeium/windsurf/mcp_config.json. If Open MCP config file opens a path, edit that file and ignore the others.
Remote HTTP uses a url field. Cascade's examples also accept serverUrl. Put the token in headers.Authorization. Cascade expands ${env:VIBE_API_TOKEN} inside headers, which keeps the secret out of a file you might commit. On a Teams plan, an admin may have to allow remote MCP transports before a URL entry connects. A local stdio server does not need that switch.
Do not commit the raw token in .devin/mcp_config.json. That file is for a shared project. Use the local file or an env interpolation.
Server URL and token
App builders such as Lovable talk to a public HTTPS address. They cannot launch the local npx vibe-coding-plan-mcp process used by Claude Desktop and Cursor. Point them at the hosted server and send the personal token from your account.
Server URL · streamable HTTP · not SSE
https://vibecoderplanner.com/mcp
Create the token at API Tokens after you sign in. Copy it once. The dashboard will not show the secret again.
The token lasts 30 days. When calls start returning unauthorized, create a new token and paste it into the connector again. Revoke the old one.
Do not choose OAuth, MCP OAuth, or "Add & authorize" for this server. That sign-in path is set up for ChatGPT. These builders need the API token.
Paste the token alone when the field is labeled bearer token or API key. If the form asks for a header, set the name to Authorization and the value to Bearer plus the token, with one space between them.
The connection lets the builder chat read and create your projects. It does not put the token into the app you publish. If the shipped app must call Vibe Coding Plan, that is a separate server-side integration, and the token stays in an environment variable.
What the server can do from chat
These are the tools on the hosted server at https://vibecoderplanner.com/mcp. The builder calls them when your message needs a plan, an estimate, a stack, or a saved project. You do not run them by hand.
plan_coding_project
Breaks a named idea into tasks. Each task comes back with a title, a description, estimated hours, and the titles of tasks that should happen first. The reply also includes total hours. A free account receives a short demo plan and is_demo is true. A paid account receives a generated breakdown of the description you sent.
estimate_project
Same planning pass, summarized as total hours, a complexity label (Low, Medium, High, or Very High), and the task titles as phases. Use this when you want a size check before you ask the builder to start coding.
suggest_tech_stack
Returns one recommendation each for frontend, backend, database, and hosting, plus a short reason. It uses your description and any preferences you pass, such as "Laravel" or "mobile".
list_projects
Lists up to 20 projects on the signed-in account: id, name, description, and task count. Pass query when you want a name filter.
get_project_tasks
Loads one project you own. You pass project_id from list_projects. The reply includes each task id, title, description, status, and estimated hours.
create_project
Creates a project on your account. name is required. description is optional. Set generate_plan to true to save a task list on that project in the same call. Saved tasks store the title, description, hours, and dependencies. The long coding prompt for a task is filled when you generate the plan in the Vibe Coding Plan app.
Hosted server config
Add this entry inside the existing mcpServers object. Replace the token, or use the env form if your agent expands it. Save the file and start a new agent turn.
{
"mcpServers": {
"vibe-coding-plan": {
"url": "https://vibecoderplanner.com/mcp",
"headers": {
"Authorization": "Bearer your-api-token-here"
}
}
}
}
From the Devin CLI, the same remote server is devin mcp add -s user vibe-coding-plan https://vibecoderplanner.com/mcp. Add the Authorization header in the file the command writes if the CLI does not prompt for it. -s user is every project. -s project writes a project file you can share only after the token is removed.
Local process, if you want it
This starts npx on your machine. It uses the same API token, through VIBE_API_TOKEN, and it does not use the hosted URL. Pick one entry with the name vibe-coding-plan, not both, or the agent has two copies of the same tools.
{
"mcpServers": {
"vibe-coding-plan": {
"command": "npx",
"args": ["-y", "vibe-coding-plan-mcp"],
"env": { "VIBE_API_TOKEN": "your-api-token-here" }
}
}
}
The local package is the one documented on the MCP server page for Claude Desktop and Cursor. Browser builders cannot use this block.
Example: planning a change in a repo you already have
Windsurf is different from Lovable because the code is already on disk. The useful loop is: describe the change, save a plan, then let the agent edit the repo one task at a time while you look at the diff.
Do not plan the whole product again. "Use vibe-coding-plan estimate_project. Description: add team invites to this repo. An owner emails an invite, the invite expires in seven days, and the invited person joins the existing account. Do not edit files." If the phase list includes a new auth system, the description was too loose. Point at the files you already have and estimate again.
Save it. "Use vibe-coding-plan create_project. Name: Team Invites. Description: email invite, seven-day expiry, join an existing account. generate_plan true." Then "get_project_tasks for that id. Implement only the task that adds the invite table and model. Match the patterns already in this repo."
Stop between tasks. Review the diff. Ask for the next title only after the first one typechecks. The agent can see the repository. The MCP server cannot. If a task description disagrees with the code, trust the code and tell the agent what to change in the plan's wording on the next message. The saved card in Vibe Coding Plan will still have the original description until you edit it in the app.
A stack call is optional here. suggest_tech_stack will recommend a frontend, backend, database, and host from the description. If the repo is already Laravel and MySQL, say that in preferences so the recommendation does not suggest a new platform.
The server never appears
You edited a config the current agent does not read. Use Open MCP config file, or confirm Devin Local is the tab you are typing in.
The JSON has two mcpServers keys. The second one replaces the first. Put vibe-coding-plan next to the other servers inside the same object.
Authorization is Bearer with nothing after it. The env var was empty. Export VIBE_API_TOKEN in the environment that launches the app, or paste the token into the header and keep that file unshared.
A remote URL stays disconnected on a team plan. Ask the admin to allow remote MCP. The stdio block above still works without that allowlist, because it is a local process.
Questions
Which config should I use? Hosted URL if you also plan from Lovable, Bolt, v0, Replit, or Base44. Local npx if this editor is the only client and you want the process on the machine.
Does Windsurf publish the app with the token inside it? No. The header is for the agent. Do not copy it into source.
Why are there two file paths online? The product moved from Windsurf and Codeium paths to Devin paths. The file your MCP menu opens is the one that counts.
Turn any idea into a fully planned, code-ready project in minutes. Vibe Planner uses AI to break your concept into tasks, generate developer prompts, and execute them automatically.
Start Building FreeNo credit card required
Describe your idea and get a structured plan with tasks, milestones, and technical decisions in seconds.
Each task comes with optimized prompts for Cursor, Copilot, or any AI coding tool you use.
AI agents write code, create branches, and open Pull Requests on your GitHub repo — hands-free.
Track progress with a visual board. Drag tasks between columns, edit details, and stay organized.
React, Next.js, Laravel, Django, Flutter, and more. AI plans are tailored to your stack.
Turn any idea into a fully planned, code-ready project in minutes. Vibe Planner uses AI to break your concept into tasks, generate developer prompts, and execute them automatically.
Start Building FreeNo credit card required
Describe your idea and get a structured plan with tasks, milestones, and technical decisions in seconds.
Each task comes with optimized prompts for Cursor, Copilot, or any AI coding tool you use.
AI agents write code, create branches, and open Pull Requests on your GitHub repo — hands-free.
Track progress with a visual board. Drag tasks between columns, edit details, and stay organized.
React, Next.js, Laravel, Django, Flutter, and more. AI plans are tailored to your stack.