Back to Catalog

react-analyzer-mcp

azer/react-analyzer-mcp
🔗 Latest commit:335f2a3
🕒 Updated:Sep 9, 2025, 01:05 PM
TypeScript
Development

MCP server for analyzing & generating docs for React code locally

MCP Trust Score
Based on our comprehensive evaluation criteria
🤖 Evaluated by gemini-2.5-flashFix
Trust Score53/100
GitHub Metrics
Repository statistics and activity
⭐ GitHub Stars:46
👥 Contributors:1
📋 Total Issues:0
📦 Has Releases:No
🔧 Has CI/CD Pipeline:No
Configuration
Configuration example extracted from README.md for Claude Desktop and other clients.
🤖 Evaluated by gemini-2.5-flashFix
{
  "react-analyzer-mcp": {
    "command": "node",
    "args": [
      "/Users/azer/code/sandbox/react-analyzer-mcp/build/index.js"
    ],
    "env": {}
  }
}
MCP Protocol Support
Implemented MCP protocol features
🤖 Evaluated by gemini-2.5-flashFix
Tools:
Prompts:
Resources:
Sampling:
Roots:
Logging:
STDIO Transport:
HTTP Transport:
OAuth2 Auth:
Dependencies
2 dependencies
Libraries and frameworks used by this MCP server
🤖 Evaluated by gemini-2.5-flashFix
Add Quality Badge
Show your MCP trust score in your README
Trust Score Badge
[![Trust Score](https://archestra.ai/mcp-catalog/api/badge/quality/azer/react-analyzer-mcp)](https://archestra.ai/mcp-catalog/azer__react-analyzer-mcp)
README.md

react-analyzer-mcp

Analyze & generate docs for React code using the Model Context Protocol. Based on react-analyzer library.

What it does

This tool analyzes React component files (JSX/TSX) and extracts information about components and their props.

Available Tools

  • analyze-react: Analyzes a single React component from source code
  • analyze-project: Generates documentation for all React components in a project folder
  • list-projects: Lists all projects under the root folder

Installation

# Clone the repository
git clone https://github.com/azer/react-analyzer-mcp.git
cd react-analyzer-mcp

# Install dependencies
npm install

# Update PROJECT_ROOT in the index.ts file.
vim src/index.ts

# Build
npm run build

Using with Claude

  1. Enable MCP server in the Claude Desktop config:
{
    "react-analyzer-mcp": {
      "command": "node",
      "args": [
        "/Users/azer/code/sandbox/react-analyzer-mcp/build/index.js"
      ]
    }
}
  1. Connect Claude to your MCP server using the Claude Shell.

  2. Use the tools directly in Claude conversations:

Analyze my project's React components in the "ui" folder.

Or:

What React components do I have in my project?

Examples

Analyzing a project folder:

Input:

Can you analyze the components in my "foobar" folder?

Output:

# Components

## Button

### Props

| Prop | Type | Optional | Default |
|------|------|----------|---------|
| `variant` | `string` | ✓ | `primary` |
| `size` | `string` | ✓ | `md` |
| `onClick` | `function` | ✓ | |
...

License

MIT

react-analyzer-mcp MCP Server | Documentation & Integration | Archestra