drio
Open app

Model Context Protocol (MCP) Implementation

Source

Learn MCP by building from Scarch

Catalog onlyCatalog onlySTDIO

Overview

Model Context Protocol (MCP) is an open protocol that enables AI assistants to interact with external tools and data sources, providing a modular framework for building MCP-compatible servers and clients.

To use the MCP implementation, clone the repository, install the dependencies, and run the provided examples for STDIO or HTTP+SSE servers and clients.

  • JSON-RPC 2.0 message handling - Protocol initialization and capability negotiation - Tool registration with JSON Schema - Standardized error handling and tool invocation - Support for STDIO and HTTP+SSE transports
  1. Building AI tools that require interaction with external data sources.
  2. Creating custom servers and clients that adhere to the MCP framework.
  3. Debugging and monitoring MCP servers using the MCP Inspector.

Add to your AI client

Use these steps to connect Model Context Protocol (MCP) Implementation in Cursor, Claude, VS Code, and other MCP-compatible apps. The same JSON appears in the Use with menu above for one-click copy.

Cursor

Add this to your .cursor/mcp.json file in your project root, then restart Cursor.

.cursor/mcp.json

{
  "mcpServers": {
    "learn-mcp-by-building-ashiknesin": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-learn-mcp-by-building-ashiknesin"
      ]
    }
  }
}

Claude Desktop

Add this server entry to the mcpServers object in your Claude Desktop config, then restart the app.

~/Library/Application Support/Claude/claude_desktop_config.json (macOS) or %APPDATA%\Claude\claude_desktop_config.json (Windows)

{
  "mcpServers": {
    "learn-mcp-by-building-ashiknesin": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-learn-mcp-by-building-ashiknesin"
      ]
    }
  }
}

Claude Code

Add this to your project's .mcp.json file. Claude Code will detect it automatically.

.mcp.json (project root)

{
  "mcpServers": {
    "learn-mcp-by-building-ashiknesin": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-learn-mcp-by-building-ashiknesin"
      ]
    }
  }
}

VS Code (Copilot)

Add this to your .vscode/mcp.json file. Requires the GitHub Copilot extension with MCP support enabled.

.vscode/mcp.json

{
  "servers": {
    "learn-mcp-by-building-ashiknesin": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-learn-mcp-by-building-ashiknesin"
      ]
    }
  }
}

Windsurf

Add this to your Windsurf MCP config file, then restart Windsurf.

~/.codeium/windsurf/mcp_config.json

{
  "mcpServers": {
    "learn-mcp-by-building-ashiknesin": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-learn-mcp-by-building-ashiknesin"
      ]
    }
  }
}

Cline

Open Cline settings, navigate to MCP Servers, and add this server configuration.

Cline MCP Settings (via UI)

{
  "mcpServers": {
    "learn-mcp-by-building-ashiknesin": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-learn-mcp-by-building-ashiknesin"
      ]
    }
  }
}

FAQ

What is the purpose of MCP?

MCP allows AI assistants to communicate with various tools and data sources in a standardized way.

Is there a visual interface for debugging?

Yes, the MCP Inspector provides a visual interface for monitoring and debugging MCP servers.

What are the prerequisites for running the project?

You need Node.js 20.x or later and npm or pnpm to install the dependencies.