Provides a bridge between Claude AI and React development, enabling creation, dev server runs, file edits, and package installs.
Configuration
View docs{
"mcpServers": {
"react_mcp": {
"command": "node",
"args": [
"C:/Users/kalip/OneDrive/Desktop/react-mcp/index.js"
]
}
}
}React MCP provides a bridge between Claude AI and a React development environment, enabling Claude to create apps, run development servers, manage files, install packages, execute terminal commands, and monitor long-running processes. It delivers practical, hands-on control over your React projects through the Model Context Protocol.
You connect an MCP client to the React MCP server to perform real-world development tasks. You can create new React applications, start development servers, read and write files, install npm packages, run arbitrary terminal commands, and monitor long-running processes in real time. Use the available tools to orchestrate end-to-end workflows from a single interface.
Prerequisites: make sure Node.js is installed on your system. You also need a client that supports the Model Context Protocol (MCP) to interact with the server.
Step 1: Prepare your MCP server configuration for the Claude Desktop client by including the following stdio-based server entry. This uses a local node process to run the server script.
{
"mcpServers": {
"react_mcp": {
"command": "node",
"args": [
"C:/Users/kalip/OneDrive/Desktop/react-mcp/index.js"
]
}
}
}Configuration notes: The server runs via standard input/output (stdio) transport, so your client connects through the local process I/O. There are no HTTP endpoints configured for this server in the provided setup.
Security considerations: keep the server process confined to trusted development workflows. Do not expose the stdio server to untrusted networks. If you need to adjust access, manage it through your local environment and MCP client configuration.
Troubleshooting tips: if the server fails to start, verify that the path to the index.js script is correct and that Node.js is installed. Check the client logs for transport errors and confirm that the MCP server entry name (react_mcp) is correctly referenced by your client configuration.
Creates a new React application with optional templates.
Runs a React project in development mode.
Executes arbitrary terminal commands.
Fetches output from a running or completed process.
Terminates a running process.
Lists all currently running processes.
Creates or edits a file with specified content.
Reads the contents of a file.
Installs an npm package in a project, with optional dev flag.
Checks the status of an ongoing package installation.