react-docs-mcp
About
AI-powered semantic search over React documentation for Claude, Cursor, and other MCP clients.
Details
- Author
- sannnao
- Categories
- Developer Tools, Other, AI, Knowledge Base
Jump to
Setup
Install react-docs-mcp in your MCP client (Claude Desktop, Cursor, Windsurf, and others).
Repository: https://github.com/sannnao/react-docs-mcp
Follow the installation instructions in the repository README, then restart your MCP client.
AI-powered semantic search over React documentation for Claude, Cursor, and other MCP clients.
Also available — same engine, other docs:📱react-native-docs-mcp(repo) — official React Native docs (reactnative.dev), with per-release version pinning 📋react-hook-form-docs-mcp(repo) — official React Hook Form docs (react-hook-form.com)
All packages share one search engine (developed in this monorepo underpackages/), so improvements land in all of them.
claude mcp add --transport stdio react-docs -- npx react-docs-mcp
Edit:~/Library/Application Support/Claude/claude_desktop_config.json(macOS) or%APPDATA%\Claude\claude_desktop_config.json(Windows)
{ "mcpServers": { "react-docs": { "command": "npx", "args": ["-y", "react-docs-mcp"] } } }
Settings→Cursor settings→Tools and MCP→ Add server:
{ "mcpServers": { "react-docs": { "command": "npx", "args": ["-y", "react-docs-mcp"] } } }
That's it!Restart your editor and ask about React.
- 🔑 No API Key: Unlike hosted docs services (Context7, GitMCP), everything runs on your machine — no account, no key, no rate limits
- 🔌 Works Offline: Clones the official react.dev docs repo once, then searches locally — no network calls at query time
- 🔍 Semantic Search: AI-powered search using embeddings for conceptual matches
- ⚡ Fast Results: In-memory vector search with hybrid keyword+semantic ranking
- 📦 Zero Config: Works withnpx- no installation needed
- 🤖 Local AI: Runs embeddings locally (no API costs)
- 📝 Concise Responses: Returns summaries instead of full documentation
- 🔄 Auto-sync: Pulls latest docs from react.dev automatically
Add to your Claude Desktop configuration file:
macOS:~/Library/Application Support/Claude/claude_desktop_config.jsonWindows:%APPDATA%\Claude\claude_desktop_config.json
{ "mcpServers": { "react-docs": { "command": "node", "args": ["/absolute/path/to/reactDocsMcp/dist/index.js"] } } }
{ "mcpServers": { "react-docs": { "command": "node", "args": ["/absolute/path/to/reactDocsMcp/dist/index.js"] } } }
Once configured, the server provides the following capabilities to AI agents:
- query(required): Search query string
- section(optional): Filter by section (learn, reference, blog, community)
- limit(optional): Maximum number of results (default: 10, max: 50)
Search for "useState hook" in the learn section
- path(required): Document path (e.g., "learn/hooks/useState")
- full(optional): Return the full raw page instead of the ~1500 char summary (default: false)
Whyfull?The default ~1500 char summary is enough for most API references, but it can cut off partway through longer pages — migration guides, upgrade walkthroughs, or anything with many sequential steps. If the summary seems to end mid-thought or you need every step of a guide, ask for the full page:
Get the full content of the React 19 upgrade guide, not just the summary
which callsget_docwith{ "path": "learn/upgrading-to-react-19", "full": true }and returns the complete raw page instead of the truncated summary.
List all available documentation sections.
Pull latest documentation from the Git repository.
npx react-docs-mcp --version # print the installed package version and exit
(Version pinning via--docs-versionis areact-native-docs-mcpfeature — react.dev has no versioned docs.)
The server exposes documentation as resources with the URI pattern:
- react-docs://learn- List all learn section docs
- react-docs://learn/hooks/useState- Get useState documentation
- react-docs://reference/react/Component- Get Component API reference
reactDocsMcp/ ├── src/ │ ├── index.ts # MCP server entry point │ ├── docsManager.ts # Git & file operations │ ├── markdownParser.ts # Markdown parsing │ ├── searchEngine.ts # Search implementation │ ├── types.ts # TypeScript types │ └── config.ts # Configuration ├── dist/ # Compiled output └── TECHNICAL_SPEC.md # Technical documentation
- Initialization: On first run, clones the official React documentation repository
- Indexing: Parses all markdown files and builds an in-memory search index
- Search: Provides keyword-based search with relevance scoring
- Updates: Can pull latest changes from the repository and re-index
- Ensure Node.js 18+ is installed
- Check that the build completed successfully (npm run build)
- Verify the path in your MCP configuration is absolute and correct
- The repository may still be cloning (check console output)
- Try runningupdate_docstool to refresh the index
- Check internet connection
- Verify Git is installed and accessible
- Check firewall/proxy settings
For detailed technical information, seeTECHNICAL_SPEC.md.
This is a personal project for connecting React documentation to AI coding agents. Feel free to fork and modify for your own use.
This is a web browser that enables your coding agent, such as Claude Code, to visit websites on your behalf and assist you in identifying bugs or creating UI test cases.
Share your team's Coding Best Practices with Cursor, VS Code, Claude code, Windsurf, JetBrains IDEs and other coding tools supporting remote MCP connection.
Lance is an agent that runs on its own cloud Mac and handles everything on the App Store Connect side of shipping an iOS app. It connects to coding agents like Claude Code and Codex through MCP and takes over the parts they can't do: creating apps on App Store Connect, setting up notifications / widgets, filling out listing metadata, uploading builds to TestFlight, submitting for review, and responding to App Review feedback. Because it has its own Mac, it can also build, run, and test users' apps and capture screenshots.
AI-native static site generator with built-in MCP server. Build sites, create content, apply themes, search docs, and deploy via Claude Code or any MCP client.
A universal MCP server that connects to any Storybook site and extracts documentation in real-time using Playwright. Use it with any AI or client that supports MCP (Model Context Protocol)—Cursor, Claude Desktop, Windsurf, or other MCP hosts.
Exposes WebPinch tasks, projects, site audits, and stats as MCP tools/resources/prompts for Claude Code, Cursor, and other MCP clients.
Access WordPress documentation and development tools.
The DataFast MCP server lets MCP-compatible clients such as Codex, Claude Code, and Cursor query your analytics and manage your account through natural language.
Inkrun's remote MCP server lets AI agents like Claude turn Markdown into themed, consistent and reproducible on-brand PDFs with a single tool call
Transform your scattered documentation into AI-ready knowledge that works seamlessly with Claude, Cursor, VS Code, and other AI tools.
Sign in to leave a review
Use Google, GitHub, or an email account so ratings stay tied to real people.
No reviews posted yet.
