DemoTool MCP Server
# DemoTool MCP Server
A modular Model Context Protocol (MCP) server for the DemoTool project. This server provides custom tools that AI assistants in Cursor can use to better understand and interact with the codebase.
## What is MCP?
Model Context Protocol (MCP) is an open protocol that allows AI assistants to securely interact with external data sources and tools. This server exposes project-specific tools that Cursor can use to enhance development workflows.
## Project Structure
The server is organized into a modular architecture for easy maintenance and scalability:
```
mcp-server/
├── src/
│ ├── config/ # Server configuration
│ │ ├── server.config.ts
│ │ └── index.ts
│ ├── server/ # Server setup and request handlers
│ │ ├── setup.ts
│ │ └── index.ts
│ ├── tools/ # Tool implementations
│ │ ├── tool-registry.ts # Tool registry pattern
│ │ ├── hello-world.tool.ts # Example tool
│ │ └── index.ts
│ ├── types/ # TypeScript type definitions
│ │ ├── tool.types.ts
│ │ ├── server.types.ts
│ │ └── index.ts
│ └── index.ts # Main entry point
├── dist/ # Compiled JavaScript output
├── package.json
└── tsconfig.json
```
## Available Tools
This MCP server currently provides:
1. **hello_world** - Returns a friendly hello world message
- Optional parameter: `name` (string) - Name to greet, defaults to "World"
## Installation
1. Install dependencies:
```bash
cd mcp-server
npm install
```
2. Build the server:
```bash
npm run build
```
## Configuration in Cursor
To integrate this MCP server with Cursor:
### Method 1: Using Cursor Settings UI
1. Open Cursor Settings
2. Navigate to **Features** → **MCP**
3. Click **+ Add New MCP Server**
4. Configure:
- **Name**: `kids-daily-tool`
- **Type**: `stdio`
- **Command**: `node /home/fernando/code/kids-daily-tool/mcp-server/dist/index.js`
### Method 2: Manual Configuration (Advanced)
Edit Cursor's MCP configuration file directly:
**Linux/Mac**: `~/.config/cursor/mcp.json`
**Windows**: `%APPDATA%\Cursor\mcp.json`
Add this configuration:
```json
{
"mcpServers": {
"kids-daily-tool": {
"command": "node",
"args": ["/home/fernando/code/kids-daily-tool/mcp-server/dist/index.js"],
"env": {}
}
}
}
```
## Usage in Cursor
Once configured, you can use natural language prompts in Cursor Composer to invoke the tool:
- "Say hello to me!"
- "Use the hello_world tool"
- "Call the hello_world MCP tool with name: Fernando"
Cursor will automatically detect when to use the MCP tool and execute it on your behalf. The tool will return a friendly greeting message.
## Development
To modify the server:
1. Edit files in `src/`
2. Rebuild: `npm run build`
3. Restart Cursor to pick up changes
## Troubleshooting
### Server not showing up in Cursor
- Make sure you've built the server (`npm run build`)
- Verify the path in your configuration is absolute
- Restart Cursor after making configuration changes
### Tool errors
- Check the Cursor Developer Console for error messages
- Verify file permissions on the project directory
- Ensure Node.js is available in your PATH
## Extending the Server
The modular architecture makes it easy to add new tools. Follow these steps:
### 1. Create a New Tool
Create a new file in `src/tools/`, e.g., `my-new-tool.tool.ts`:
```typescript
import {
Tool,
ToolDefinition,
ToolArguments,
ToolResult,
} from "../types/index.js";
export class MyNewTool implements Tool {
getDefinition(): ToolDefinition {
return {
name: "my_new_tool",
description: "Description of what your tool does",
inputSchema: {
type: "object",
properties: {
param1: {
type: "string",
description: "Description of param1",
},
},
required: ["param1"],
},
};
}
async execute(args: ToolArguments): Promise<ToolResult> {
// Implement your tool logic here
const result = `Processing: ${args.param1}`;
return {
content: [
{
type: "text",
text: result,
},
],
};
}
}
```
### 2. Register the Tool
Add your tool to `src/tools/index.ts`:
```typescript
export * from "./my-new-tool.tool.js";
import { MyNewTool } from "./my-new-tool.tool.js";
export function getAllTools(): Tool[] {
return [
new HelloWorldTool(),
new MyNewTool(), // Add your tool here
];
}
```
### 3. Rebuild and Test
```bash
npm run build
```
That's it! The tool registry will automatically pick up your new tool.
## Architecture Benefits
- **Modularity**: Each tool is self-contained in its own file
- **Type Safety**: Full TypeScript support with proper interfaces
- **Scalability**: Easy to add new tools without modifying core logic
- **Maintainability**: Clear separation of concerns
- **Testability**: Individual tools can be tested in isolation
## Security Notes
- This server only provides read-only access to project information
- It runs locally and doesn't send data to external services
- Always review MCP server code before integrating it with your editor
TDQS
Scored across 7 tools
Each tool targets a distinct Angular domain (components, data fetching, forms, models, modals, design system), so most selections are clear. There is mild overlap in the component cluster: design_system_standards explicitly covers modals while modal_best_practices is a separate tool, and design_system_available_components overlaps with design_system_standards.
Nearly all tools use snake_case with a <domain>_standards suffix (angular_component_standards, forms, models, design_system, data_fetching). The remaining two (design_system_available_components, modal_best_practices) deviate in suffix but stay readable and consistent in style.
Seven tools is well-scoped for a standards/reference server, with one tool per major Angular concern plus a component registry. No redundancy pushing the count up.
Covers the core Angular development concerns plus a component registry, giving solid coverage. Some common areas (routing, state management, testing, services/directives) are absent, but these are reasonable gaps for a standards-focused server.