Claude Code MCP 10 Rekomendasi Wajib Pasang: Alat Ajaib yang Menggandakan Kemampuan Asisten Pemrograman AI

ByAPIYI - Stable and affordable AI API

十大必装 MCP 服务器详解

1. 🐙 GitHub MCP – 代码协作必备

适用场景: 需要频繁操作 GitHub 仓库、查看 Issues、创建 PR

claude mcp add @modelcontextprotocol/server-github

核心功能:

  • 🔍 搜索仓库: "查找所有带 bug 标签的 Issue"
  • 📝 创建 Issue/PR: "为这个修复创建一个 Pull Request"
  • 📊 查看统计: "显示本周的提交记录"
  • 🔔 通知管理: "列出我未读的通知"

配置示例:

{
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_your_token_here"
      }
    }
  }
}

最佳实践:

2. 🧠 Sequential Thinking MCP – 复杂问题推理

适用场景: 需要解决复杂算法、架构设计、调试棘手 Bug

claude mcp add @modelcontextprotocol/server-sequential-thinking

核心功能:

  • 🎯 逐步推理: 将复杂问题拆解为多个步骤
  • 🔄 思维链可视化: 查看 AI 的推理过程
  • ✅ 验证逻辑: 检查推理的每一步是否合理

使用示例:

你: "为什么这个递归函数会导致栈溢出?"

Claude (启用 Sequential Thinking):
思考步骤 1: 检查递归终止条件
思考步骤 2: 分析递归深度
思考步骤 3: 计算内存占用
结论: 缺少边界检查导致无限递归

最佳实践:

  • 对于算法优化、性能调优问题特别有效
  • 可以要求 Claude "显示详细推理过程"
  • 适合学习 AI 如何解决复杂问题

3. 📚 Context7 MCP – 实时技术文档

适用场景: 使用最新框架、查找 API 用法、了解最佳实践

claude mcp add context7

核心功能:

  • 🔍 智能搜索: 自动从官方文档、GitHub 讨论、Stack Overflow 查找答案
  • 📖 实时更新: 始终获取最新的框架版本信息
  • 💡 最佳实践: 包含社区验证的代码示例

支持的技术栈:

  • 前端: React, Vue, Next.js, Svelte
  • 后端: Django, FastAPI, Express, Rails
  • 移动: React Native, Flutter
  • 工具: Tailwind CSS, Prisma, Supabase

使用示例:

你: "Next.js 15 的 Server Actions 怎么用?"

Claude (使用 Context7):
根据最新文档 (2024年11月),Next.js 15 的 Server Actions...
[自动引用官方文档和实际代码示例]

4. 🎭 Playwright MCP – 浏览器自动化

适用场景: E2E 测试、网页抓取、UI 自动化

claude mcp add @executeautomation/playwright-mcp-server

核心功能:

  • 🌐 跨浏览器测试: Chromium, Firefox, WebKit
  • 📸 截图录屏: 自动捕获测试过程
  • 🔍 元素定位: 智能选择器生成
  • ⚡ 并发执行: 多浏览器并行测试

使用示例:

你: "测试登录流程是否正常"

Claude:
1. 打开登录页面
2. 填写用户名和密码
3. 点击登录按钮
4. 验证跳转到首页
5. 截图保存测试结果

配置示例:

{
  "playwright": {
    "command": "npx",
    "args": ["-y", "@executeautomation/playwright-mcp-server"],
    "env": {
      "PLAYWRIGHT_HEADLESS": "false"
    }
  }
}

5. 🐘 PostgreSQL MCP – 数据库操作

适用场景: 数据库设计、SQL 查询优化、数据迁移

claude mcp add @modelcontextprotocol/server-postgres

核心功能:

  • 🗄️ Schema 管理: 查看表结构、索引、约束
  • 📝 SQL 生成: 自动编写优化的查询语句
  • 🔍 性能分析: 识别慢查询和索引问题
  • 🛠️ 数据迁移: 生成迁移脚本

配置示例:

{
  "postgres": {
    "command": "npx",
    "args": ["-y", "@modelcontextprotocol/server-postgres"],
    "env": {
      "POSTGRES_CONNECTION_STRING": "postgresql://user:pass@localhost:5432/mydb"
    }
  }
}

安全提示:

  • ⚠️ 只读权限: 生产环境建议使用只读用户
  • 🔒 环境变量: 不要在代码中硬编码数据库密码
  • 📊 查询限制: 设置查询结果行数上限

6. 🐳 Docker MCP – 容器管理

适用场景: 容器化部署、本地开发环境、微服务管理

claude mcp add @ivo-toby/docker-mcp-server

核心功能:

  • 🚀 容器管理: 启动/停止/重启容器
  • 📦 镜像操作: 构建、拉取、推送镜像
  • 🔍 日志查看: 实时查看容器日志
  • 📊 资源监控: CPU、内存、网络使用情况

使用示例:

你: "启动开发环境的所有服务"

Claude:
执行 docker-compose up -d
✅ PostgreSQL 已启动
✅ Redis 已启动
✅ API 服务已启动
所有服务运行正常,访问 http://localhost:3000

7. 🔄 Memory MCP – 跨会话记忆

适用场景: 长期项目、个性化配置、上下文保持

claude mcp add @modelcontextprotocol/server-memory

核心功能:

  • 💾 持久化记忆: 保存项目偏好、代码风格
  • 🔍 智能回忆: 自动关联相关历史对话
  • 🏷️ 知识管理: 标签化存储重要信息

使用示例:

第一次对话:
你: "我们项目使用 TypeScript + React + Tailwind"
Claude: "已记住,后续代码将遵循此技术栈"

第二天:
你: "创建一个按钮组件"
Claude: (自动使用 TypeScript + Tailwind 编写)

8. 🏗️ Supabase MCP – 后端即服务

适用场景: 快速原型开发、实时应用、用户认证

claude mcp add supabase-mcp

核心功能:

  • 🗄️ 数据库操作: 直接查询 Supabase Postgres
  • 🔐 身份验证: 管理用户和权限
  • 📦 存储管理: 上传/下载文件
  • 🔄 实时订阅: 监听数据变化

配置示例:

{
  "supabase": {
    "command": "npx",
    "args": ["-y", "supabase-mcp"],
    "env": {
      "SUPABASE_URL": "https://xxx.supabase.co",
      "SUPABASE_KEY": "your_service_role_key"
    }
  }
}

9. 📦 NPM MCP – 包管理助手

适用场景: 依赖管理、包版本选择、漏洞检查

claude mcp add npm-mcp-server

核心功能:

  • 🔍 包搜索: 查找合适的 npm 包
  • 📊 版本对比: 分析不同版本差异
  • 🛡️ 安全审计: 检查已知漏洞
  • 📝 依赖分析: 查看依赖树

使用示例:

你: "我需要一个日期处理库"

Claude:
推荐 date-fns (现代化,Tree-shakeable)
- 每周下载: 1200万
- 大小: 13.2KB (按需引入)
- 无依赖,TypeScript 支持
安装命令: npm install date-fns

10. 🎨 Figma MCP – 设计协作

适用场景: 前端开发、设计还原、组件生成

claude mcp add figma-mcp

核心功能:

  • 🎨 设计稿解析: 提取颜色、间距、字体
  • 🧩 组件生成: 自动创建 React/Vue 组件
  • 📐 尺寸计算: 转换设计稿到响应式代码
  • 🔄 实时同步: 监听设计变更

使用示例:

你: "根据这个 Figma 链接生成 Card 组件"

Claude:
[分析设计稿]
生成 TypeScript React 组件:
- 圆角: 12px
- 阴影: shadow-lg
- 间距: p-6
- 响应式: sm/md/lg 断点

MCP 安装与配置

基础安装流程

  1. 确认环境:
# 检查 Claude Code 版本
claude --version  # 需要 0.3.0+

# 检查 Node.js (大多数 MCP 需要)
node --version  # 建议 18.0.0+
  1. 安装 MCP 服务器:
# 方式 1: 使用内置命令 (推荐)
claude mcp add @modelcontextprotocol/server-github

# 方式 2: 手动配置
npm install -g @modelcontextprotocol/server-github
  1. 验证安装:
claude mcp list

配置文件详解

位置: ~/.claude.json (macOS/Linux) 或 %APPDATA%\Claude\config.json (Windows)

完整配置示例:

{
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "${GITHUB_TOKEN}"
      },
      "disabled": false
    },
    "postgres": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-postgres"],
      "env": {
        "POSTGRES_CONNECTION_STRING": "postgresql://localhost/dev"
      },
      "timeout": 30000
    }
  },
  "globalShortcuts": {
    "toggleMcp": "Ctrl+Shift+M"
  }
}

配置参数说明:

  • command: 执行命令 (通常是 npx 或 node)
  • args: 命令参数
  • env: 环境变量 (支持 ${VAR_NAME} 引用系统变量)
  • disabled: 临时禁用 MCP
  • timeout: 超时时间 (毫秒)

常见问题解决

❌ MCP 无法启动

症状: Error: MCP server failed to start

解决方案:

# 1. 检查 Node.js 版本
node --version  # 应该 >= 18.0.0

# 2. 清除 npm 缓存
npm cache clean --force

# 3. 重新安装
claude mcp remove problematic-mcp
claude mcp add problematic-mcp

# 4. 查看详细日志
claude mcp logs problematic-mcp

⏱️ MCP 响应缓慢

优化建议:

  1. 减少 MCP 数量: 只安装真正需要的
  2. 设置超时时间: 避免长时间等待
  3. 使用缓存: 配置 cacheSize 参数
{
  "mcpServers": {
    "github": {
      "timeout": 10000,
      "cacheSize": 100
    }
  }
}

🔒 权限不足错误

GitHub MCP 示例:

# 生成新 Token
# 访问: https://github.com/settings/tokens/new
# 勾选权限: repo, read:org, read:user

# 在配置中使用
export GITHUB_TOKEN="ghp_..."
claude mcp add @modelcontextprotocol/server-github

最佳实践总结

推荐组合方案

全栈开发者:

claude mcp add @modelcontextprotocol/server-github
claude mcp add @modelcontextprotocol/server-postgres
claude mcp add @ivo-toby/docker-mcp-server

前端工程师:

claude mcp add context7
claude mcp add @executeautomation/playwright-mcp-server
claude mcp add figma-mcp

数据工程师:

claude mcp add @modelcontextprotocol/server-postgres
claude mcp add supabase-mcp
claude mcp add @modelcontextprotocol/server-memory

性能优化建议

优化项 说明 效果
按需启用 只在需要时启用特定 MCP 减少 30% 启动时间
环境隔离 开发/生产使用不同配置 提高安全性
缓存配置 启用结果缓存 减少 50% 重复查询
超时设置 合理设置超时时间 避免卡顿

总结

选择合适的 MCP 服务器能让 Claude Code 的能力翻倍。本文推荐的 10 个 MCP 覆盖了开发工作流的各个环节:

✅ 代码协作: GitHub MCP
✅ 复杂推理: Sequential Thinking
✅ 技术文档: Context7
✅ 自动化测试: Playwright
✅ 数据库管理: PostgreSQL
✅ 容器化: Docker
✅ 跨会话记忆: Memory
✅ 后端服务: Supabase
✅ 包管理: NPM
✅ 设计协作: Figma

下一步行动:

  1. 根据你的技术栈选择 2-3 个核心 MCP
  2. 使用 claude mcp add 一键安装
  3. 在实际项目中测试效果
  4. 逐步扩展到其他 MCP

推荐阅读:

💡 小贴士: 如果你使用 Claude API 进行开发,推荐试试 APIYI 这个 AI 模型 API 中转站——价格实惠、稳定可靠,还提供免费试用额度,非常适合个人开发者和小团队。

十大必装 MCP 服务器

1. GitHub MCP Server ⭐⭐⭐⭐⭐

功能: 直接与 GitHub 仓库、PR、Issues、CI/CD 工作流交互

这是使用最广泛的 MCP 服务器，几乎是开发者必装。安装后，你可以让 Claude：

  • 创建和审查 Pull Request
  • 管理 Issues 和讨论
  • 监控 GitHub Actions 状态
  • 搜索代码和提交历史

安装命令:

claude mcp add github --scope user -- npx -y @modelcontextprotocol/server-github

环境变量: 需要设置 GITHUB_PERSONAL_ACCESS_TOKEN

适合场景: 开源维护、团队协作、代码审查自动化

2. Sequential Thinking ⭐⭐⭐⭐⭐

功能: 结构化思考服务器，让 Claude 分步骤解决复杂问题

这个服务器改变了 Claude Code 处理复杂问题的方式。它引入了一种模拟人类认知的反思性思考过程，让 Claude 能够：

  • 有条理地分解问题
  • 在推理过程中修正方向
  • 保持长链条推理的上下文

安装命令:

claude mcp add sequential-thinking -- npx -y @modelcontextprotocol/server-sequential-thinking

适合场景: 架构设计、复杂 bug 调试、大型功能规划

3. Filesystem MCP Server ⭐⭐⭐⭐⭐

功能: 安全的本地文件操作——读取、写入、编辑、搜索目录

这是官方基础服务器，提供细粒度的权限控制，支持复杂的代码库重构工作流。

安装命令:

claude mcp add filesystem -- npx -y @modelcontextprotocol/server-filesystem /path/to/allowed/directory

适合场景: 本地代码操作、批量文件处理、项目迁移

4. Context7 MCP ⭐⭐⭐⭐⭐

功能: 实时获取最新的开发文档和 API 参考

解决了 AI 知识库过时的痛点。Context7 会自动获取当前版本的文档，确保 Claude 提供的代码示例和 API 用法是最新的。

安装命令:

claude mcp add context7 -- npx -y @context7/mcp

适合场景: 使用 React、Next.js、Vue 等快速迭代框架的团队

5. Playwright MCP ⭐⭐⭐⭐

功能: 浏览器自动化，支持端到端测试和网页数据提取

Playwright MCP 使用可访问性快照（Accessibility Snapshots）来理解网页结构，无需视觉分析即可进行精准操作。

安装命令:

claude mcp add playwright -- npx -y @playwright/mcp@latest

适合场景: E2E 测试编写、网页爬虫、前端自动化

6. Brave Search MCP ⭐⭐⭐⭐

功能: 隐私优先的网络搜索，支持研究和内容引用

让 Claude 能够搜索最新信息、引用来源、总结内容，而不牺牲隐私。

安装命令:

claude mcp add brave-search -- npx -y @anthropic/mcp-server-brave-search

环境变量: 需要设置 BRAVE_API_KEY

适合场景: 技术调研、文档引用、竞品分析

7. PostgreSQL MCP Server ⭐⭐⭐⭐

功能: 直接与 PostgreSQL 数据库交互

让 Claude 能够查询数据库、分析数据结构、生成 SQL 语句、优化查询性能。

安装命令:

claude mcp add postgres -- npx -y @modelcontextprotocol/server-postgres postgresql://user:pass@localhost/db

适合场景: 数据分析、数据库调优、后端开发

8. Docker MCP Server ⭐⭐⭐⭐

功能: 构建、运行、检查容器，直接通过 AI 命令管理 Docker

非常适合调试服务、生成 Dockerfile、管理可复现的开发环境。

安装命令:

claude mcp add docker -- npx -y @modelcontextprotocol/server-docker

适合场景: 容器化开发、DevOps 工作流、环境调试

9. Sentry MCP ⭐⭐⭐

功能: 错误追踪和性能监控集成

让 Claude 能够分析 Sentry 中的错误报告，并立即建议修复方案。

安装方式: SSE 远程服务器，需要 Sentry API token

适合场景: 生产环境调试、错误分析、性能优化

10. Notion MCP ⭐⭐⭐

功能: 知识库集成，支持页面和数据库操作

让 Claude 能够读取和更新 Notion 中的文档，实现知识管理与代码开发的联动。

安装方式: 官方实现，需要 Notion API key

适合场景: 文档管理、项目记录、知识库维护

MCP 服务器分类速查

claude-code-mcp-top-10-must-install-id 图示

分类 MCP 服务器 核心价值
版本控制 GitHub、GitLab PR 管理、代码审查自动化
思维增强 Sequential Thinking 复杂问题结构化推理
文件操作 Filesystem 本地文件安全操作
文档获取 Context7、Brave Search 实时文档和搜索能力
浏览器自动化 Playwright、Puppeteer E2E 测试、网页爬虫
数据库 PostgreSQL、Supabase 数据查询和分析
容器化 Docker 容器管理、环境调试
监控 Sentry、PostHog 错误追踪、产品分析
生产力 Notion、Linear、Figma 知识库、任务管理、设计

Panduan Konfigurasi Dasar MCP

Perintah Inti

# Menambahkan server MCP
claude mcp add [name] --scope user -- [command]

# Melihat MCP yang sudah terinstal
claude mcp list

# Menghapus server MCP
claude mcp remove [name]

# Menguji server MCP
claude mcp get [name]

Lokasi File Konfigurasi

Sistem Path File Konfigurasi
macOS ~/Library/Application Support/Claude/claude_desktop_config.json
Windows %APPDATA%\Claude\claude_desktop_config.json
Umum ~/.claude.json (direkomendasikan)

Contoh Konfigurasi

{
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "your_token_here"
      }
    },
    "sequential-thinking": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-sequential-thinking"]
    }
  }
}

Penjelasan Scope

Scope Keterangan Kasus Penggunaan
local Hanya tersedia untuk proyek saat ini Tools khusus proyek
user Tersedia untuk semua proyek, bersifat privat Tools pribadi yang sering dipakai
project Konfigurasi level proyek, bisa dibagikan Tools untuk kolaborasi tim

Tips Konfigurasi

  1. Prasyarat Node.js: Sebagian besar MCP menggunakan npx, pastikan Node.js sudah terinstal
  2. Restart untuk Efektif: Setelah mengubah konfigurasi, perlu restart Claude Code
  3. Penanganan Khusus Windows: Perintah npx lokal mungkin memerlukan prefix cmd /c
  4. Penyesuaian Timeout: Atur timeout startup melalui MCP_TIMEOUT=10000

Saran: Melalui APIYI apiyi.com kamu bisa mendapatkan akses API berbagai model AI, yang dikombinasikan dengan MCP bisa menghasilkan workflow AI yang lebih fleksibel.

Best Practice Instalasi MCP

Kombinasi Instalasi yang Direkomendasikan

Developer Frontend:

  • Context7 (dokumentasi framework terbaru)
  • Playwright (testing E2E)
  • GitHub (version control)

Developer Backend:

  • PostgreSQL (operasi database)
  • Docker (manajemen container)
  • GitHub (version control)

Developer Full-stack:

  • Sequential Thinking (masalah kompleks)
  • GitHub (version control)
  • Context7 (dokumentasi real-time)

Hal-hal yang Perlu Diperhatikan

  1. Jangan Terlalu Banyak: Instal 2-3 MCP inti saja, terlalu banyak akan memperlambat startup
  2. Cek Dependensi: Pastikan dependensi seperti Node.js, Docker sudah terinstal dengan benar
  3. Lindungi Kredensial: API Key dan Token jangan di-commit ke repository kode
  4. Update Berkala: Ekosistem MCP berkembang cepat, tetap update untuk mendapatkan fitur baru

Pertanyaan Umum

Q1: Apa perbedaan antara MCP dan fitur bawaan Claude Code?

Fitur bawaan Claude Code fokus pada pengeditan kode dan operasi terminal. Sedangkan MCP memperluas kemampuan Claude untuk berinteraksi dengan sistem eksternal—database, layanan cloud, tools pihak ketiga, dan lain-lain. Analoginya begini: fitur bawaan adalah "kemampuan dasar", MCP adalah "plugin perluasan".

Q2: Sudah instal MCP tapi Claude tidak merespons, bagaimana solusinya?

Cara mengatasi yang umum:

  1. Restart Claude Code agar konfigurasi diterapkan
  2. Gunakan claude mcp list untuk mengecek apakah instalasi berhasil
  3. Periksa apakah environment variable (seperti API Token) sudah diatur dengan benar
  4. Cek apakah ada dependency yang kurang (seperti Node.js)
  5. Coba tingkatkan waktu timeout startup MCP_TIMEOUT=10000

Q3: Apa yang perlu diperhatikan pengguna di China saat menggunakan MCP?

Beberapa MCP server bergantung pada layanan luar negeri (seperti GitHub API, Brave Search), yang mungkin mengalami masalah akses. Saran:

  1. Gunakan layanan relay seperti APIYI apiyi.com untuk mendapatkan akses API yang stabil
  2. Prioritaskan MCP yang berjalan lokal (seperti Filesystem, Sequential Thinking)
  3. Untuk MCP yang memerlukan jaringan, pastikan koneksi internet stabil

Kesimpulan

Nilai inti dari Claude Code MCP:

  1. Perluasan Kemampuan: Mengubah Claude dari code editor menjadi platform pengembangan yang lebih powerful
  2. Integrasi Workflow: Satu interface untuk mengoperasikan berbagai tools seperti GitHub, database, layanan cloud, dan lainnya
  3. Efisiensi Berlipat: Otomatisasi pekerjaan repetitif, fokus pada tugas pengembangan inti

10 MCP Wajib Instal – Ringkasan Cepat:

  • Version Control: GitHub
  • Peningkatan Berpikir: Sequential Thinking
  • Operasi File: Filesystem
  • Dokumentasi Real-time: Context7
  • Pencarian Web: Brave Search
  • Otomasi Browser: Playwright
  • Database: PostgreSQL
  • Manajemen Container: Docker
  • Monitoring Error: Sentry
  • Knowledge Base: Notion

Disarankan mulai dari 2-3 skenario yang paling sering kamugunakan, lalu perluas secara bertahap. Melalui APIYI apiyi.com kamu bisa mendapatkan berbagai API model AI, yang dikombinasikan dengan MCP dapat membangun workflow pengembangan yang lebih powerful.

description: "Panduan lengkap untuk memahami dan mengimplementasikan Model Context Protocol (MCP) – protokol terbuka yang memungkinkan AI mengakses berbagai sumber data dan tools secara terstandar"

Model Context Protocol (MCP) adalah standar terbuka yang dikembangkan oleh Anthropic untuk menghubungkan aplikasi AI dengan berbagai sumber data dan tools. Bayangkan seperti USB untuk AI – satu interface standar yang bisa menghubungkan AI assistant kamu dengan database, API, file system, dan berbagai layanan lainnya.

Mengapa MCP Penting?

Sebelum ada MCP, setiap integrasi AI harus dibuat custom untuk masing-masing data source. Mau akses Google Drive? Buat custom integration. Mau connect ke database? Buat lagi dari nol. Ini jelas tidak efisien.

MCP menyelesaikan masalah ini dengan menyediakan protokol standar yang:

  1. Universal: Satu cara standar untuk semua integrasi
  2. Modular: Tambah atau ganti data source dengan mudah
  3. Secure: Built-in authentication dan authorization
  4. Scalable: Bisa handle multiple connections secara efisien

Arsitektur MCP

MCP menggunakan arsitektur client-server yang sederhana:

┌─────────────┐         ┌──────────────┐         ┌─────────────┐
│             │         │              │         │             │
│  MCP Host   │────────▶│  MCP Client  │────────▶│ MCP Server  │
│  (Claude)   │         │              │         │ (Database)  │
│             │         │              │         │             │
└─────────────┘         └──────────────┘         └─────────────┘
  • MCP Host: Aplikasi AI yang ingin mengakses data (seperti Claude)
  • MCP Client: Component yang mengelola koneksi ke servers
  • MCP Server: Service yang menyediakan akses ke specific data source atau tools

Komponen Utama MCP

1. Resources

Resources adalah data yang bisa diakses oleh AI. Bisa berupa:

  • File dan dokumen
  • Database records
  • API responses
  • Live data feeds

Contoh resource URI:

file:///home/user/documents/report.pdf
postgres://localhost/mydb/users
https://api.example.com/data

2. Prompts

Prompts adalah template yang bisa digunakan kembali untuk task-task umum. Misalnya:

{
  "name": "analyze-code",
  "description": "Analisis kualitas kode",
  "arguments": [
    {
      "name": "file_path",
      "description": "Path ke file yang akan dianalisis",
      "required": true
    }
  ]
}

3. Tools

Tools adalah fungsi yang bisa dipanggil oleh AI untuk melakukan actions. Contohnya:

{
  name: "create_file",
  description: "Buat file baru",
  inputSchema: {
    type: "object",
    properties: {
      path: { type: "string" },
      content: { type: "string" }
    },
    required: ["path", "content"]
  }
}

Implementasi MCP Server Sederhana

Berikut contoh membuat MCP server sederhana menggunakan TypeScript:

import { Server } from "@modelcontextprotocol/sdk/server/index.js";
import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
import {
  ListToolsRequestSchema,
  CallToolRequestSchema,
} from "@modelcontextprotocol/sdk/types.js";

// Inisialisasi server
const server = new Server(
  {
    name: "my-mcp-server",
    version: "1.0.0",
  },
  {
    capabilities: {
      tools: {},
    },
  }
);

// Daftarkan tools yang tersedia
server.setRequestHandler(ListToolsRequestSchema, async () => {
  return {
    tools: [
      {
        name: "get_current_time",
        description: "Dapatkan waktu saat ini",
        inputSchema: {
          type: "object",
          properties: {
            timezone: {
              type: "string",
              description: "Timezone (opsional)",
            },
          },
        },
      },
    ],
  };
});

// Handle tool calls
server.setRequestHandler(CallToolRequestSchema, async (request) => {
  if (request.params.name === "get_current_time") {
    const timezone = request.params.arguments?.timezone || "UTC";
    const time = new Date().toLocaleString("id-ID", { timeZone: timezone });
    
    return {
      content: [
        {
          type: "text",
          text: `Waktu saat ini (${timezone}): ${time}`,
        },
      ],
    };
  }
  
  throw new Error(`Unknown tool: ${request.params.name}`);
});

// Start server
async function main() {
  const transport = new StdioServerTransport();
  await server.connect(transport);
  console.error("MCP Server running on stdio");
}

main().catch(console.error);

Konfigurasi di Claude Desktop

Untuk menggunakan MCP server di Claude Desktop, tambahkan konfigurasi di file config:

macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
Windows: %APPDATA%\Claude\claude_desktop_config.json

{
  "mcpServers": {
    "my-server": {
      "command": "node",
      "args": ["/path/to/your/server/build/index.js"]
    }
  }
}

Atau jika menggunakan npx:

{
  "mcpServers": {
    "filesystem": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-filesystem",
        "/path/to/allowed/directory"
      ]
    }
  }
}

Best Practices

1. Security First

Selalu validasi input dan batasi akses:

server.setRequestHandler(CallToolRequestSchema, async (request) => {
  // Validasi input
  const { path } = request.params.arguments;
  
  // Pastikan path ada dalam allowed directory
  if (!isPathAllowed(path)) {
    throw new Error("Access denied: path not allowed");
  }
  
  // Process request...
});

2. Error Handling

Berikan error messages yang jelas:

try {
  const result = await performOperation();
  return { content: [{ type: "text", text: result }] };
} catch (error) {
  return {
    content: [{
      type: "text",
      text: `Error: ${error.message}\nSilakan coba lagi atau hubungi admin.`
    }],
    isError: true
  };
}

3. Logging

Implement proper logging untuk debugging:

import winston from "winston";

const logger = winston.createLogger({
  level: "info",
  format: winston.format.json(),
  transports: [
    new winston.transports.File({ filename: "mcp-server.log" })
  ]
});

server.setRequestHandler(CallToolRequestSchema, async (request) => {
  logger.info("Tool called", {
    tool: request.params.name,
    timestamp: new Date().toISOString()
  });
  // Process request...
});

Use Cases Populer

1. Database Access

{
  name: "query_database",
  description: "Jalankan SQL query",
  inputSchema: {
    type: "object",
    properties: {
      query: { type: "string" },
      database: { type: "string" }
    }
  }
}

2. File System Operations

{
  name: "read_file",
  description: "Baca isi file",
  inputSchema: {
    type: "object",
    properties: {
      path: { type: "string" }
    }
  }
}

3. API Integration

{
  name: "call_api",
  description: "Panggil external API",
  inputSchema: {
    type: "object",
    properties: {
      endpoint: { type: "string" },
      method: { type: "string" },
      data: { type: "object" }
    }
  }
}

Troubleshooting Tips

Server Tidak Terdeteksi

  1. Cek path di config file sudah benar
  2. Pastikan dependencies sudah terinstall
  3. Restart Claude Desktop
  4. Cek logs untuk error messages

Connection Issues

// Tambahkan timeout handling
const timeout = setTimeout(() => {
  console.error("Connection timeout");
  process.exit(1);
}, 30000);

server.connect(transport).then(() => {
  clearTimeout(timeout);
  console.error("Connected successfully");
});

Performance Issues

  • Implement caching untuk data yang sering diakses
  • Gunakan connection pooling untuk database
  • Batasi jumlah concurrent requests
  • Monitor memory usage

Resources & Dokumentasi

Untuk informasi lebih lanjut tentang MCP, berikut beberapa resource yang berguna:

  1. MCP 官方文档: modelcontextprotocol.io – Dokumentasi lengkap spesifikasi MCP dari Anthropic

  2. 官方 MCP 服务器仓库: github.com/modelcontextprotocol/servers – Koleksi implementasi referensi MCP server yang dimaintain secara resmi

  3. Awesome MCP Servers: github.com/wong2/awesome-mcp-servers – Daftar pilihan MCP server yang dikurasi oleh komunitas

  4. Claude Code MCP 文档: code.claude.com/docs/en/mcp – Dokumentasi resmi konfigurasi dan penggunaan MCP di Claude Code

Kesimpulan

MCP adalah game-changer dalam ekosistem AI. Dengan standardisasi cara AI mengakses data dan tools, development menjadi lebih cepat, maintenance lebih mudah, dan integrasi lebih reliable.

Mulai eksperimen dengan MCP servers yang sudah tersedia, lalu coba buat custom server untuk use case spesifik kamu. Komunitas MCP berkembang pesat, jadi ini waktu yang tepat untuk mulai explore!

Penulis: Tim Teknis
Diskusi Teknis: Yuk diskusi di kolom komentar, lebih banyak resource bisa diakses di komunitas teknis APIYI apiyi.com

Try AI Large Model https://api.apiyi.com for free
Stable and reliable AI LM API aggregation service, Get 300 Millions Tokens for Free~

Similar Posts