Cloudflare open-sources use-mcp React library and AI Playground for MCP integration

Published: 2025-06-18 | 6 min read

Cloudflare has announced the open-sourcing of two key tools for developers working with Model Context Protocol (MCP):

1. use-mcp - A React library that simplifies connecting to remote MCP servers with just 3 lines of code
2. AI Playground - A complete chat interface platform for testing MCP server connections

Simplifying MCP Client Development

The use-mcp library abstracts away complex connection handling, offering:

• Automatic transport protocol support (Streamable HTTP and SSE)
• Built-in OAuth 2.1 authentication flows
• Dynamic tool discovery from connected servers
• Connection management with retry logic
• Debugging and monitoring capabilities

Example implementation: javascript import { useMcp } from 'use-mcp/react' function MyComponent() { const { state, tools, callTool } = useMcp({ url: 'https://mcp-server.example.com' }) return <div>Your actual UI code</div> }

AI Playground Now Available

The open-sourced AI Playground provides:

• Pre-built MCP client functionality
• Support for multiple LLM models
• Debug interface for monitoring MCP connections
• One-click deployment via Cloudflare Workers

Getting Started

Developers can deploy these tools directly:

• Deploy use-mcp Inspector
• Deploy AI Playground

Cloudflare encourages contributions to the MCP ecosystem and invites feedback via email at [email protected].