mcp-use-ts

MCP-Use TS is a TypeScript framework for building and consuming MCP servers and clients with an integrated inspector and UI widgets. The server side exposes MCP tools and resources that can be called by LLMs or agents, while the client side demonstrates how to connect to those servers, discover available tools, and invoke them. Use cases include building domain-specific MCP servers (for weather, finance, data pipelines, etc.) and creating UI widgets that render tool results within an inspector-enabled interface. The toolkit includes tooling to hot-reload during development and to bundle UI widgets for standalone deployment, making it straightforward to iterate on tool definitions and UI components. You can connect to multiple MCP servers from a single MCP client and control tool access and observability through the provided abstractions.

Prerequisites:

• Node.js (14+ or 16+ recommended) and npm/yarn installed
• Basic familiarity with TypeScript and npm package management

Installation steps:

1. Install Node.js from https://nodejs.org/ if you don’t already have it.

2. Install the MCP-Use TS server package (example uses npm):

   npm init -y npm install --save @mcp-use/server-mcp-use-ts

3. Initialize or scaffold an MCP server project (if starting from scratch):

   npx @mcp-use/cli create-mcp-use-app my-mcp-app cd my-mcp-app

4. Install dependencies for the server inside your project:

   npm install

5. Run the development server with hot-reload and inspector:

   npm run dev

6. Open http://localhost:3000 to access the MCP server UI and inspector. Adjust ports or configuration as needed in your project setup.

Tips and common considerations:

• The inspector UI is auto-mounted in development mode, typically at /inspector. Use this to debug tools and view tool calls.
• You can host MCP servers with multiple transports (HTTP/SSE or WebSocket) depending on your deployment needs.
• When defining tools, consider adding Zod schemas for parameters to enforce type safety and improve tooling support.
• Environment variables (e.g., GITHUB_TOKEN in examples) can be supplied via the mcp_config env section or your deployment platform’s secret management.
• If you publish or share your MCP server, ensure your authentication and OAuth flows (if used) are properly configured for secure access.
• The npm package name used in examples is @mcp-use/server-mcp-use-ts; adjust if your organization or package naming differs.