AI导哈

Todo应用MCP服务器示例

一个通过Todo应用程序学习MCP服务器实现和Claude Desktop集成的示例项目。

  • by seekseep
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 seekseep/todo-with-mcp

使用说明

使用MCP完成所有操作

MCP (Model Context Protocol) 用于了解服务器行为的学习示例项目。

在本项目中Todo 您可以通过应用程序学习以下内容：

  • MCP 服务器的基本实现方法
  • Claude Desktop 的合作方法
  • 如何提供资源和工具

所需环境

  • Node.js：v20以上
  • npm：v10以上
  • 克劳德桌面: 最新版

安装，安装

1.安装依赖包

# API
cd api
npm install

# フロントエンド
cd ../client
npm install

# MCP サーバー
cd ../mcp
npm install

2.迁移数据库

cd api
npx prisma migrate dev

起动手顺

API启动

cd api
npm run dev

API服务器是 http://localhost:3000 中所述修改相应参数的值。

启动前端

在另一个终端运行：

cd client
npm run dev

前端波 http://localhost:5173 中所述修改相应参数的值。

动作确认

在浏览器中 http://localhost:5173 中所述修改相应参数的值Todo 请确保应用程序工作正常。

Claude Desktop 中的MCP 服务器设置

macOS 在…的情况下

~/Library/Application Support/Claude/claude_desktop_config.json 编辑：

{
  "mcpServers": {
    "todo": {
      "command": "node",
      "args": [
        "/Users/seekseep/Development/github.com/seekseep/todo-with-mcp/mcp/app.js"
      ]
    }
  }
}

注意: args 中的路径，请根据使用环境变更为绝对路径。

Windows 在…的情况下

%APPDATA%\Claude\claude_desktop_config.json 编辑：

{
  "mcpServers": {
    "todo": {
      "command": "node",
      "args": [
        "C:\\Users\\YourUsername\\path\\to\\todo-with-mcp\\mcp\\app.js"
      ]
    }
  }
}

注意:

  • args 中的路径请根据使用环境变更为绝对路径
  • Windows 那么，我们需要逃离反高峰（\\)

设定后

Claude Desktop 重新启动时MCP 服务器可用。

相关 MCP