buildmymcpserver/apps/web/app/(marketing)/guides/create-mcp-server-without-code/page.tsx

223 lines
10 KiB
TypeScript
Raw Normal View History

import { JsonLd } from '@/components/json-ld';
import { StaticCodeBlock } from '@/components/static-code-block';
import { articleJsonLd, breadcrumbJsonLd, faqJsonLd, pageMetadata } from '@/lib/seo';
import Link from 'next/link';
import { ArticleShell, H2, Note, OL, P, Strong, UL } from '../article-shell';
const PATH = '/guides/create-mcp-server-without-code';
const TITLE = 'How to create an MCP server without writing code (2026)';
const DESCRIPTION =
'Turn a plain-language description into a hosted, OAuth-protected MCP server — no SDK, no Docker, no TypeScript. What works, what the limits are, and when you still need code.';
export const metadata = pageMetadata({ title: TITLE, description: DESCRIPTION, path: PATH });
const ARTICLE_FAQ = [
{
q: 'Do I really write zero code to create an MCP server?',
a: 'Yes — you describe the tools in natural language. The platform generates a TypeScript MCP server, runs static checks against banned patterns, builds a Docker image and deploys it behind OAuth 2.1. You never touch the code unless you want to: the full source is exportable at any time.',
},
{
q: 'How long does generation take?',
a: 'Spec to image to live URL typically completes in 4590 seconds. You watch the build log stream live in the dashboard.',
},
{
q: 'Which AI clients can use a no-code MCP server?',
a: 'Anything that speaks the MCP spec over Streamable HTTP: Claude Desktop, Cursor, ChatGPT custom connectors, VS Code Copilot and Continue.dev. You get a copy-paste install snippet for each.',
},
{
q: 'What does it cost to try?',
a: 'The free tier includes one hosted server and 100,000 tool calls per month — no credit card. The full TypeScript source of every server you build is exportable, so there is no lock-in.',
},
];
const PROMPT_EXAMPLE = `Create an MCP server that searches our Notion workspace.
Tools: search_pages, get_page_content.
Auth: NOTION_API_KEY.`;
const SNIPPET_EXAMPLE = `{
"mcpServers": {
"notion": {
"url": "https://notion-x9.mcp.buildmymcpserver.com/mcp",
"auth": "oauth2"
}
}
}`;
export default function Page() {
return (
<>
<JsonLd
data={articleJsonLd({
title: TITLE,
description: DESCRIPTION,
path: PATH,
datePublished: '2026-07-08',
authorName: 'Marco Sadjadi',
wordCount: 1500,
})}
/>
<JsonLd
data={breadcrumbJsonLd([
{ name: 'Home', path: '/' },
{ name: 'Guides', path: '/guides' },
{ name: TITLE, path: PATH },
])}
/>
<JsonLd data={faqJsonLd(ARTICLE_FAQ)} />
<ArticleShell
title={TITLE}
subtitle="The Model Context Protocol lets AI assistants call your tools — but the official route to a server means an SDK, a transport, an auth layer and somewhere to host it. Here is the route that skips all four, and an honest list of where it stops."
updated="July 2026"
>
<H2>What no code actually has to cover</H2>
<P>
An MCP server that works outside your laptop is more than tool functions. To let Claude,
Cursor or ChatGPT call it from anywhere, you need four things: the{' '}
<Strong>server code</Strong> itself (tool definitions plus handlers), a{' '}
<Strong>remote transport</Strong> (Streamable HTTP the STDIO servers most tutorials
build only work locally), an <Strong>auth layer</Strong> (the MCP spec requires OAuth 2.1
for remote servers), and <Strong>hosting</Strong> that keeps the process alive. A no-code
claim that only generates the first item leaves you with three engineering problems. The
flow below covers all four.
</P>
<H2>Step 1 describe the tool in plain language</H2>
<P>
You write a prompt, not a spec. Name the tools you want, the credentials they need, and
what they should do. A working example:
</P>
<StaticCodeBlock code={PROMPT_EXAMPLE} label="prompt" />
<P>
Three lines is enough because the generator asks the model for a structured spec, not
prose: tool names, input schemas, the API calls behind them, and which environment
variables hold secrets. If the description is ambiguous, you see the interpreted spec
before anything builds and can edit it.
</P>
<H2>Step 2 generation and static checks</H2>
<P>
From the spec, the platform renders a TypeScript MCP server. Before anything runs, the
generated code goes through static checks against banned patterns no
<Strong> child processes, no filesystem escapes, no calls to unlisted hosts</Strong>. This
matters more in a no-code flow than in a hand-written one: you did not read the code, so
the platform has to.
</P>
<P>
The output is real, exportable TypeScript. If you cancel your account tomorrow, you can{' '}
<Link href="/docs/authoring" className="text-[--color-accent] hover:underline">
take the source
</Link>{' '}
and run it yourself there is no proprietary runtime inside.
</P>
<H2>Step 3 build and deploy</H2>
<P>
The server is packaged into a Docker image and deployed to its own isolated container
one container per server, so a bug in your Notion tool cannot see your Stripe tool's
credentials. Secrets you provide (like <Strong>NOTION_API_KEY</Strong>) are encrypted
with AES-256-GCM at rest and injected as environment variables only at runtime. They are
never logged and never echoed back into the dashboard.
</P>
<P>
The whole pipeline spec, render, checks, image build, deploy typically completes in{' '}
<Strong>4590 seconds</Strong>, streamed live to the dashboard so you can watch each
stage pass.
</P>
<H2>Step 4 the OAuth-protected URL</H2>
<P>
The deployed server is a public Streamable HTTP endpoint, but every request is gated by
OAuth 2.1 before it reaches your container. The control plane acts as the authorization
server PKCE, Dynamic Client Registration (RFC 7591) and Resource Indicators (RFC 8707)
which is exactly the handshake modern MCP clients expect. You never configure any of
it;{' '}
<Link href="/docs/oauth" className="text-[--color-accent] hover:underline">
the OAuth docs
</Link>{' '}
explain what happens under the hood.
</P>
<H2>Step 5 install in your client</H2>
<P>The dashboard renders a copy-paste snippet per client. For Claude Desktop:</P>
<StaticCodeBlock code={SNIPPET_EXAMPLE} label="claude_desktop_config.json" />
<P>
On first use the client opens the OAuth consent flow in your browser; approve it once and
the tools appear. The same server works in Cursor, ChatGPT custom connectors, VS Code
Copilot and Continue.dev see the client-specific walkthroughs for{' '}
<Link href="/guides/claude-desktop-mcp-setup" className="text-[--color-accent] hover:underline">
Claude Desktop
</Link>{' '}
and{' '}
<Link href="/guides/chatgpt-mcp-connector" className="text-[--color-accent] hover:underline">
ChatGPT
</Link>
.
</P>
<H2>What you cannot do without code honest limits</H2>
<UL>
<li>
<Strong>Complex business logic.</Strong> Generation is good at call this API, shape
the response. Multi-step workflows with branching state, retries with compensation, or
heavy data transformation deserve hand-written code. Export the generated source and
extend it that is the intended escape hatch.
</li>
<li>
<Strong>Unusual protocols.</Strong> Tools that need gRPC, raw TCP, or binary SDKs are
out of scope for prompt-generation; the generated servers speak HTTP to upstream APIs.
</li>
<li>
<Strong>Long-running jobs.</Strong> A tool call is a request/response. Anything that
takes minutes belongs in a queue you own, with the MCP tool submitting and polling.
</li>
<li>
<Strong>Compliance paperwork.</Strong> If procurement requires SOC 2 or HIPAA
certification today, a generated-and-hosted server will not check that box no such
certifications are claimed. Self-hosting the exported source inside your own audited
infrastructure is the workaround.
</li>
</UL>
<Note>
Rule of thumb: if you can describe the tool in three sentences, generation gets you to
production. If your description needs a diagram, write code or generate first, export,
then edit.
</Note>
<H2>Try it against a real API first</H2>
<OL>
<li>
Pick one API you use daily Notion, GitHub, your own REST backend (
<Link href="/guides/rest-api-to-mcp-server" className="text-[--color-accent] hover:underline">
wrapping a REST API
</Link>{' '}
is the most common first server).
</li>
<li>Write the three-line prompt: tools, credentials, behavior.</li>
<li>Watch the build, paste the snippet, ask your assistant to use the tool.</li>
</OL>
<P>
The{' '}
<Link href="/pricing" className="text-[--color-accent] hover:underline">
free tier
</Link>{' '}
covers one server and 100,000 tool calls a month, which is more than enough to find out
whether the no-code route fits your case. If it does not, you have lost ten minutes and
gained a working reference implementation to export. Browse{' '}
<Link href="/templates" className="text-[--color-accent] hover:underline">
the template gallery
</Link>{' '}
if you would rather fork a working server than write a prompt.
</P>
<H2>FAQ</H2>
{ARTICLE_FAQ.map((f) => (
<div key={f.q} className="mt-5">
<h3 className="text-[15px] font-semibold tracking-tight text-[--color-fg]">{f.q}</h3>
<p className="mt-1.5 text-[14px] leading-relaxed text-[--color-fg-muted]">{f.a}</p>
</div>
))}
</ArticleShell>
</>
);
}