> ## Documentation Index
> Fetch the complete documentation index at: https://docs.metabind.ai/llms.txt
> Use this file to discover all available pages before exploring further.
# Build an MCP Server in Minutes
> Wrap your APIs as MCP tools. Native UI from one tool call. Live on Claude, ChatGPT, and every MCP host with one button.
Skip the protocol boilerplate, the hosting, and the schema plumbing. Define your tools, press publish, and your MCP server is live on Claude, ChatGPT, VS Code, and every MCP-compatible host. The same definition embeds inside your own iOS, Android, or web app as a native AI assistant.
No credit card. No server to manage. Publish your first MCP App in minutes.
Clone the Oak & Ivory retail sample and watch native product cards render in Claude Desktop.
## Wrap any API as an MCP tool
A Metabind Data Tool is a typed function the AI can call. You declare an input schema, an output schema, and an `async` handler that runs in a V8 sandbox with your secrets injected at runtime. No credentials in client code, no hosting to manage.
```ts theme={null}
export default defineDataSource({
metadata: {
title: "Product Search",
description: "Search the product catalog by keyword or category"
},
properties: {
searchTerm: { type: "string", description: "Term to search for" },
category: { type: "string", description: "Filter by category" },
limit: {
type: "number",
validation: { min: 1, max: 50 },
defaultValue: 10
}
},
output: {
products: PropertyArray({
valueType: PropertyGroup({
properties: {
id: PropertyString({}),
name: PropertyString({}),
price: PropertyNumber({}),
inStock: PropertyBoolean({})
}
})
}),
total: PropertyNumber({})
},
handler: async (props, env) => {
const res = await fetch(
`https://api.example.com/products?q=${props.searchTerm}`,
{ headers: { "Authorization": `Bearer ${env.secrets.API_KEY}` } }
);
if (!res.ok) throw new Error(`API returned ${res.status}`);
return res.json();
}
});
```
That's a complete MCP tool. The handler runs in an isolated V8 sandbox with a 60-second execution limit, 128 MB memory cap, restricted outbound HTTP, and no filesystem access. Secrets are encrypted at rest, decrypted only at read, never embedded in component code or visible in the package bundle.
## And get native UI from one tool call
Most MCP servers return JSON dumps. Metabind's Interactive Tools return real, schema-validated native UI — product cards, comparison tables, galleries, 3D viewers — rendered as SwiftUI on iOS, Jetpack Compose on Android, and React on the web. From a single BindJS component definition. No WebViews. No bespoke renderer per surface.
```ts theme={null}
const properties = {
title: { type: "string" },
price: { type: "string" },
description: { type: "string", inspector: { control: "multiline" } }
} satisfies ComponentProperties;
const body = (props: InferProps): Component => {
return VStack({ spacing: 16, alignment: "leading" }, [
Text(props.title).font("title2").fontWeight("bold"),
Text(props.price).foregroundStyle(Color("#7A7A7A")),
Text(props.description).font("body")
])
.padding(24)
.background(Color("white"))
.cornerRadius(12);
};
export default defineComponent({
metadata: {
title: "Product Detail",
description: "Render a product detail card. Use when the user wants to view one product."
},
properties,
body
});
```
That BindJS component compiles to SwiftUI on iOS, Jetpack Compose on Android, and React on the web. When the AI calls the tool, Metabind validates the input against the schema and renders only components from your published allowlist — the AI cannot inject anything you didn't approve, on any platform.
.png)
## Skip the parts that aren't your product
| You'd normally build | Metabind handles |
| ------------------------------------------------- | --------------------------------------------------------------------- |
| Protocol boilerplate, transport, host conformance | Hosted MCP server on `mcp.metabind.ai` |
| Tool input/output schema plumbing | Auto-generated from your component definitions |
| Server hosting, scaling, monitoring | Auto-scaling multi-tenant infrastructure on AWS |
| UI rendering code per platform | SwiftUI, Compose, and React from one BindJS definition |
| Visual tooling for authoring + previews | MCP App Studio — visual builder, live device previews, sample apps |
| Staging, versioning, rollback | Draft + production endpoints, package versioning, one-button rollback |
## Three tool types, one MCP App
Wrap any REST or GraphQL endpoint as an MCP tool. Handlers run in V8 sandboxes with injected secrets. Credentials never reach the client.
Return schema-validated native UI instead of JSON. Component allowlists enforce what can render. Same definition on iOS, Android, web.
Documents and assets served through semantic search. The AI retrieves rich content via MCP tool calls.
## How it works
Author Data Tools and Interactive Tools in the visual builder. Live preview as you go — on a real device, not a simulator. The draft endpoint is testable from the first save.
Every project ships with two MCP server URLs — a draft endpoint that serves everything (published, modified, draft) and a production endpoint that serves only published work. Point Claude Desktop at the draft URL while you iterate.
One button promotes the draft to `mcp.metabind.ai//`. Claude Desktop, ChatGPT, VS Code, and any MCP-compatible host can connect with the URL. Hosts pick up new tool versions on their next list-tools call.
The Assistant SDK ships the same MCP App as a native AI assistant inside your iOS, Android, or web product. Same tools, same governance, same brand — rendered as SwiftUI, Jetpack Compose, or React directly in your app.
## Built on the open MCP protocol
Metabind aligns with the open Model Context Protocol per [SEP-1724](https://github.com/modelcontextprotocol/specification/blob/main/SEP/draft/SEP-1724.md), and Interactive Tools follow [SEP-1865 (MCP Apps: Interactive User Interfaces for MCP)](https://github.com/modelcontextprotocol/specification/blob/main/SEP/draft/SEP-1865.md). Anything you build on Metabind speaks the MCP wire format and runs in any MCP-compatible host — today and going forward.
## Common questions
A from-scratch MCP server means writing transport conformance, schema validation, hosting, secret management, and a UI renderer per surface — and then re-doing it every time the protocol evolves. Metabind ships all of that as a managed platform. You write the tools that are unique to your product; everything else is provided.
Yes. Author BindJS components in MCP App Studio or directly in code. Component allowlists per tool determine which of your components are eligible to render — a `product_search` tool can render `ProductCard` but not `AdminTable`, enforced at render time.
Yes — that's what Data Tools are. Point a Data Tool handler at any REST or GraphQL endpoint, declare the input and output schema, and the platform handles auth, sandboxing, and schema validation in both directions.
Starter: MCP App Studio, BindJS, Assistant SDK included, free invocation allowance. No credit card.
No. The web renderer (`@bindjs/renderer`) ships React components into every MCP host's sandboxed iframe by default. Native SwiftUI and Jetpack Compose rendering is unlocked by the Assistant SDK when you embed the MCP App inside your own iOS or Android app.
## Ship today
No credit card. No server to manage. Publish your first MCP App in minutes.
Five minutes, no code, Oak & Ivory product cards rendering inline in Claude Desktop.
The full Data Tool authoring guide — secrets, allowed domains, sandbox limits.
Point Claude Desktop at your draft or production MCP server URL.