> For the complete documentation index, see [llms.txt](https://manufact.com/docs/llms.txt).
The fullstack MCP framework
Build MCP Apps for ChatGPT / Claude and MCP Servers for AI Agents — in TypeScript and Python.
Build
with the mcp-use SDK
Preview
with the MCP Inspector
Deploy
to production in one command
## Quickstart
```bash theme={null}
npx create-mcp-use-app@latest
```
Or create a server manually:
```typescript theme={null}
import { MCPServer, text } from "mcp-use/server";
import { z } from "zod";
const server = new MCPServer({
name: "my-server",
version: "1.0.0",
});
server.tool({
name: "get_weather",
description: "Get weather for a city",
schema: z.object({ city: z.string() }),
}, async ({ city }) => {
return text(`Temperature: 72°F, Condition: sunny, City: ${city}`);
});
await server.listen(3000);
// Inspector at http://localhost:3000/inspector
```
```bash theme={null}
pip install mcp-use
```
```python theme={null}
from typing import Annotated
from mcp.types import ToolAnnotations
from pydantic import Field
from mcp_use import MCPServer
server = MCPServer(name="Weather Server", version="1.0.0")
@server.tool(
name="get_weather",
description="Get current weather information for a location",
annotations=ToolAnnotations(readOnlyHint=True, openWorldHint=True),
)
async def get_weather(
city: Annotated[str, Field(description="City name")],
) -> str:
return f"Temperature: 72°F, Condition: sunny, City: {city}"
server.run(transport="streamable-http", port=8000)
# Inspector at http://localhost:8000/inspector
```
## MCP Apps
MCP Apps let you build interactive widgets that work across Claude, ChatGPT, and other MCP clients — write once, run everywhere.
```typescript theme={null}
import { MCPServer, widget } from "mcp-use/server";
import { z } from "zod";
const server = new MCPServer({ name: "weather-app", version: "1.0.0" });
server.tool({
name: "get-weather",
description: "Get weather for a city",
schema: z.object({ city: z.string() }),
widget: "weather-display", // references resources/weather-display/widget.tsx
}, async ({ city }) => {
return widget({
props: { city, temperature: 22, conditions: "Sunny" },
message: `Weather in ${city}: Sunny, 22°C`,
});
});
await server.listen(3000);
```
Widgets in `resources/` are **auto-discovered** — no manual registration needed.
Build widgets with React, auto-discovery, and client-side hooks.
Step-by-step: ship an MCP App to ChatGPT.
## Templates
Ready-to-use MCP Apps and Servers you can deploy in one click or remix as your own.
Natural-language chart generation.
Conversational diagramming.
Reference patterns for every widget type.
Full gallery with demo URLs and one-click deploy buttons.
## Inspector
Test and debug your MCP servers interactively. The Inspector is **auto-included** in every server:
```typescript theme={null}
server.listen(3000);
// Inspector at http://localhost:3000/inspector
```
Or use the hosted inspector at [inspector.mcp-use.com](https://inspector.mcp-use.com), or standalone:
```bash theme={null}
npx @mcp-use/inspector --url http://localhost:3000/mcp
```
## Deploy
Ship to production in one command:
```bash theme={null}
npx @mcp-use/cli login
npx @mcp-use/cli deploy
```
Or connect a GitHub repo on [manufact.com](https://manufact.com) — production-ready with observability, metrics, logs, and branch deployments.
## Also: MCP Agent & MCP Client
mcp-use is fullstack. Alongside MCP Servers and MCP Apps, it ships a full **MCP Agent** and **MCP Client** implementation.
Connect any LLM (OpenAI, Anthropic, Google, LangChain) to any MCP server.
```python theme={null}
from langchain_openai import ChatOpenAI
from mcp_use import MCPAgent, MCPClient
client = MCPClient.from_dict({ "mcpServers": { "fs": { "command": "npx", "args": ["-y", "@modelcontextprotocol/server-filesystem", "/tmp"] } } })
agent = MCPAgent(llm=ChatOpenAI(model="gpt-4o"), client=client)
result = await agent.run("List all files in the directory")
```
Fully spec-compliant: tools, resources, prompts, sampling, elicitation, logging, notifications.
```typescript theme={null}
import { MCPClient } from "mcp-use";
const client = new MCPClient({ mcpServers: { calculator: { command: "npx", args: ["-y", "@modelcontextprotocol/server-everything"] } } });
await client.createAllSessions();
const result = await client.getSession("calculator").callTool("add", { a: 5, b: 3 });
```
## Learn More
Principles of MCP: hosts, clients, servers, and the three primitives.
Runnable samples for Python and TypeScript.
Chat with the community and the team.
Bugs, feature requests, and questions.
{}
