← Back to Blog

2026-08-299 min read

How to Build a Full-Stack Application with MCP Studio

Your architecture diagram has a dozen boxes and your coding assistant has read the documentation for none of them. Here's how to put every docs site and repo in that diagram behind one MCP server, connect it to Cursor, and build with your whole stack in context.

Your assistant has never read the docs for anything you installed

You start a new project. You pick Next.js, Postgres, Prisma, Stripe, and Vercel, because that combination works and you have shipped it before. You open Cursor, describe the first feature, and it writes something that looks completely reasonable.

Then it fails. The Prisma call uses an argument that was renamed in v5. The Stripe snippet is written against an API version from two years ago. The Vercel config references a key that was never valid.

None of this is the model being careless. It is the model working from a training snapshot, and your package.json is not in that snapshot.

The short version: every tool in your architecture diagram has a documentation site and usually a public repo. Put all of them behind one MCP server, connect that server to your IDE, and your assistant looks up the real API before it writes the call. This post walks through doing exactly that for a five-service stack, in about ten minutes.

Start with the diagram, not the code

Open whatever passes for your architecture diagram — a Figma board, a whiteboard photo, or the dependency list in your package.json. Every box on it is a thing your assistant will need to reason about, and every box has documentation somewhere.

For a typical full-stack app the list looks like this:

Layer Tool What you add as a source
Framework Next.js The docs site
Database Postgres The relevant manual chapters
ORM Prisma Docs site plus the GitHub repo
Payments Stripe The API reference
Hosting Vercel The docs site

The pattern worth internalising: add the docs site for anything with good docs, and add the GitHub repo for anything without them. Repos are where the answer lives when the documentation is thin, because the tests and the type definitions do not lie about what the API accepts.

Why one server and not five

You could build a separate MCP server per tool. Do not, at least not at first.

The questions you actually ask while building cross tool boundaries. "How do I store the Stripe customer ID on my user model and query it later" is a Prisma question, a Postgres question, and a Stripe question at the same time. A single server searches all of that in one pass and returns passages from whichever source answers best. Five servers make your assistant pick a tool before it knows where the answer lives, and it will pick wrong.

Split later, when one server's sources have grown far enough apart that the retrieval starts returning noise.

Build it

You will need an MCP Studio account (the free tier is enough to try this), your list of sources, and an MCP-compatible editor.

  1. Open the wizard. Go to MCP Studio and start a new server. Name it after the project rather than the stack — acme-checkout-stack ages better than nextjs-prisma-mcp, because the stack will change and the project will not.
  2. Add your documentation sources. Paste each docs URL. Point at the deepest section that still covers what you need rather than the marketing homepage: https://www.prisma.io/docs retrieves better than https://www.prisma.io, because the crawler spends its page budget on reference content instead of pricing pages.
  3. Add the repositories. For anything whose docs are thin, add the GitHub repo as a separate source. Sign in with GitHub first if you want to include your own private repos — internal conventions are exactly the thing a training snapshot cannot possibly know.
  4. Pick the tools. For development work, turn on get_code_examples, find_api_reference, extract_schema, and search_issues. The first two kill most hallucinated signatures; extract_schema keeps generated models honest; search_issues finds the GitHub thread about the error you are staring at.
  5. Deploy. You get an endpoint URL immediately. Indexing continues in the background as a durable job queue, so you can close the tab, and the server answers from live fetching while the index fills in behind it.

MCP Studio source setup wizard

Connect it to your editor

Deploying gives you a config block. Paste it into your editor's MCP settings and restart.

{
  "mcpServers": {
    "acme-checkout-stack": {
      "url": "https://appatools.com/mcp-studio/api/mcp/acme-checkout-stack-k3m9x2"
    }
  }
}

In Cursor that goes in .cursor/mcp.json in the project root, which has the useful side effect of committing it — everyone who clones the repo gets the same context without being told to set it up. Claude Desktop and Windsurf each have their own settings location; the connection guide covers all three.

Now ask it something you know it used to get wrong

This is the part worth doing deliberately. Pick a question your assistant previously fumbled — a method signature it invented, a config key it made up — and ask it again.

A few that tend to be revealing on a stack like this one:

  • "What is the correct way to do a nested write with a relation in the Prisma version we have installed?"
  • "Show me how to handle a Stripe webhook signature check in a Next.js route handler."
  • "What does our User model look like, and how do I add a nullable column without a destructive migration?"

The difference is not that the answers get longer. It is that they stop being plausible and start being correct, and they arrive with the passage they came from so you can check in two seconds rather than finding out at runtime.

What to do when a source is too big

Large documentation sites hit the per-source page limit, currently 5,000 pages. When that happens the fix is not a bigger limit, it is a narrower source.

Add the section rather than the site. docs.aws.amazon.com is hopeless as a single source; docs.aws.amazon.com/lambda/latest/dg/ is genuinely useful. Splitting one broad source into two or three narrow ones also improves retrieval, because the search has less irrelevant material to rank against.

The same logic applies to monorepos. Point at the package you depend on rather than the repository root.

Keep it honest as the stack moves

Sources re-crawl on a schedule, so a docs update lands without you doing anything. Two habits are still worth having:

  • After a major version bump, refresh that source manually from the dashboard. Do not wait for the schedule when you have just changed the thing the assistant will be asked about all week.
  • Check the dashboard occasionally. It shows which sources actually get retrieved. A source that never appears in an answer is either badly scoped or genuinely unnecessary, and both are worth knowing. Sources you drop free up room under the plan limit.

MCP Studio analytics dashboard with usage, source, and tool insights

The part that compounds

The first server takes ten minutes and fixes today's hallucinations. The thing that makes it worth doing is what happens over the following month.

Every new dependency becomes one more source rather than one more thing your assistant is confidently wrong about. Onboarding a teammate means handing them a config block rather than a week of "we do it this way here". And when you upgrade a framework, the assistant knows about it as soon as the docs do.

The stack stops being something your AI has opinions about and starts being something it can read.

Build your first MCP server for free →

Keep going

Building grounded AI into your own product? The MCP Studio SDK embeds the full wizard inside your app.