Use Mcp

[](https://github.com/modelcontextprotocol/use-mcp)  [](https://www.npmjs.com/package/use-mcp) 

A lightweight React hook for connecting to [Model Context Protocol (MCP)](https://github.com/modelcontextprotocol) servers. Simplifies authentication and tool calling for AI systems implementing the MCP standard.

Try it out: [Chat Demo](https://chat.use-mcp.dev) | [MCP Inspector](https://inspector.use-mcp.dev) | [Cloudflare Workers AI Playground](https://playground.ai.cloudflare.com/)

Installation

npm install use-mcp
# or
pnpm add use-mcp
# or
yarn add use-mcp

Development

To run the development environment with all examples and servers:

pnpm dev

This starts:

• Inspector: http://localhost:5001 - MCP server debugging tool
• Chat UI: http://localhost:5002 - Example chat interface
• Hono MCP Server: http://localhost:5101 - Example MCP server
• CF Agents MCP Server: http://localhost:5102 - Cloudflare Workers AI MCP server

Testing

Integration tests are located in the `test/` directory and run headlessly by default:

cd test && pnpm test              # Run tests headlessly (default)
cd test && pnpm test:headed       # Run tests with visible browser
cd test && pnpm test:watch        # Run tests in watch mode
cd test && pnpm test:ui           # Run tests with interactive UI

Features

• 🔄 Automatic connection management with reconnection and retries
• 🔐 OAuth authentication flow handling with popup and fallback support
• 📦 Simple React hook interface for MCP integration
• 🧰 Full support for MCP tools, resources, and prompts
• 📄 Access server resources and read their contents
• 💬 U