Skip to main content
Prerequisites:
  • Install Node.js (version 18 or higher)
  • npm, pnpm, or yarn package manager

​
MCP Servers

The fastest way to scaffold a new MCP server project is to use create-mcp-use-app: 
npx create-mcp-use-app my-mcp-server
cd my-mcp-server
npm install
npm run dev
This command will:
  • Create a new directory with your project name
  • Initialize a TypeScript project with mcp-use configured
  • Set up a basic MCP server template with example tools
  • Install all dependencies automatically
Check out UI Widgets with support to MCP-UI and OpenAI Apps SDK for ChatGPT.

​
Server Metadata

The generated project includes pre-configured server metadata that is visible in MCP Inspector and MCP clients:
  • Name & Title: Both set to your project name (customizable in index.ts)
  • Icons: mcp-use branding icons included in public/ folder
  • Website URL: Defaults to https://mcp-use.com (customizable)
  • Favicon: Included for browser display
These settings appear in:
  • MCP Inspector UI (server dropdown and “View server info” modal)
  • MCP clients that support server metadata
  • ChatGPT when using your server as an app
Customizing Server Metadata: Open index.ts in your project to customize: 
const server = new MCPServer({
  name: 'my-project',          // Set by create-mcp-use-app
  title: 'My Custom Title',    // display name - shown in clients
  version: '1.0.0',
  description: 'My awesome server',
  websiteUrl: 'https://my-site.com',  // Your website or docs
  favicon: 'favicon.ico',      // Already in public/ folder
  icons: [
    {
      src: 'my-icon.svg',      // Add custom icon to public/ folder
      mimeType: 'image/svg+xml',
      sizes: ['512x512']
    }
  ]
})
Note: Icon paths (like icon.svg) are automatically converted to absolute URLs (e.g., http://localhost:3000/mcp-use/public/icon.svg) when baseUrl is configured.
You can also install mcp-use as a library and build your own MCP server from scratch. 
npm install mcp-use

import { MCPServer } from "mcp-use/server";
import { z } from "zod";

const server = new MCPServer({
  name: "my-server",
  title: "My Server", // display name
  version: "1.0.0",
  description: "My custom MCP server",
  websiteUrl: "https://mcp-use.com",
  favicon: "favicon.ico",
  icons: [
    {
      src: "icon.svg",
      mimeType: "image/svg+xml",
      sizes: ["512x512"]
    }
  ]
});

// Define a tool
server.tool("get_weather", {
  description: "Get weather for a city",
  parameters: z.object({
    city: z.string().describe("City name"),
  }),
  execute: async ({ city }) => {
    return { temperature: 72, condition: "sunny", city };
  },
});

// Start server with auto-inspector
server.listen(3000);
// 🎉 Inspector at http://localhost:3000/inspector
Check out the examples here. Visit the MCP Server documentation for more details.

​
MCP Agent & Client

Install mcp_use using your preferred package manager: 
npm install mcp-use

​
Next Steps

Agent

Build AI Agents with tool calling capabilities through MCP connections

Client

A full featured MCP Client implementation for TypeScript

Server

The MCP Server framework implementation for TypeScript, with Apps SDK and MCP-UI support
Need Help? Join our Discord or Github communities.