Zenn
🤖

何も知らない状態からDevinにMCPサーバーを作ってもらった話

に公開

DevinにMCPサーバーを作ってもらった話

こんにちは! 株式会社リンケージikkitang です。

最近はもっぱら爆速の"AI"のアップデートについて、そのカオスさに楽しんでいます。

さて、先日Devinが$20からスタートできるCoreプランを発表しました。

https://dev.classmethod.jp/articles/devin-2-release/

早速契約をしたんですが、最初のプロジェクトとして 完全に雰囲気でしか理解していなかった MCPについて仕組みからちゃんと理解するべくコーディングをしてもらいました。それについてブログを書きます。

完成したもの

https://github.com/TakahashiIkki/devin-mcp-uuid-sample

実際にこれをClaude Desktopに読み込ませておいて UUIDを一個作って とか言うと 実際にUUIDを一個作ってくれます。

MCPについての気付き

MCP ClientとMCP Serverの違い

最初、私はMCPの概念を完全に理解していませんでした。実は、MCPには「クライアント」と「サーバー」という2つの概念があります:

  • MCPクライアント: AIアシスタント(例:Claude)がMCPサーバーが提供するツールを利用するために使用するもの
  • MCPサーバー: 特定の機能(例:UUID生成)を提供し、MCPクライアントからアクセス可能にするもの

最初、私は「MCPクライアント」を作ろうとしていました。そのため、Devinに以下のような依頼をしています。:

MCPクライアントを作成して、UUIDを生成できるようにしたい

しかし、実際に私がやりたかったのは「MCPサーバーを作り、UUID生成ツールを公開する」ことでした。この混乱はIssue #3にも記録されています。

ちなみに、初期のDevinが作ったコードでは、 MCP ClientはMCP Serverに接続できなかったら、MCP Client自体が UUID生成の機能を持つ という実装になっていて、それが更に混乱を加速させていました。

DevinによるMCPサーバーの作成

混乱が解消されたあと、正しくDevinに「MCPサーバー」の作成を依頼して、いい感じに作ってくれています。

プロジェクトの構造

Devinが作成したプロジェクトは、以下のような構造になっています:

devin-mcp-uuid-sample/
├── src/
│   ├── index.ts          # MCPサーバーのメインファイル
│   ├── service/
│   │   └── UuidApi.ts    # UUID生成と検証のロジック
│   └── index.test.ts     # テストファイル
├── package.json
└── README.md

実装の詳細

MCPサーバーの核となる部分は、index.tsファイルに実装されています。以下は、その一部です:

// MCPサーバーの初期化
const server = new McpServer({
  name: 'uuid-server',
  version: '1.0.0'
});

// UUIDのAPI機能を利用
const uuidApi = new UuidApi();

// ツールの定義:単一のUUIDを生成
server.tool(
  'generate-uuid',
  {},
  async () => {
    const uuid = uuidApi.generateUuid();
    return {
      content: [{ type: 'text', text: uuid }]
    };
  }
);

// ツールの定義:複数のUUIDを生成
server.tool(
  'generate-uuids',
  { count: z.number().min(1).max(100) },
  async ({ count }) => {
    const uuids = uuidApi.generateUuids(count);
    return {
      content: [{ type: 'text', text: uuids.join('\n') }]
    };
  }
);

Claude DesktopとMCPサーバーの連携

作成したMCPサーバーは、Claude Desktopなどのクライアントから利用できます。設定方法は非常に簡単です:

  1. MCPサーバーをビルド:npm run build
  2. Claude Desktopの設定に以下を追加:
{
  "mcpServers": {
    "uuid-generator": {
      "command": "node",
      "args": [
        "/path/to/devin-mcp-uuid-sample/dist/src/index.js"
      ]
    }
  }
}

これにより、Claudeから以下のツールが利用可能になります:

  1. generate-uuid: 単一のUUIDを生成
  2. generate-uuids: 指定された数のUUIDを生成(1〜100)
  3. detect-uuid-version: 指定されたUUIDの有効性とバージョンを検証

これ、ちゃんとツール名を定義しておかないと読み込んでくれなかったので、その辺またどっかで雑なネタとしてブログ書きたいですね。

得られた学び

この経験から、以下のような学びがありました:

  1. MCPの概念理解: 実際にシュッと作れましたし、MCP Client / MCP Server の違いをある程度把握することができました。
  2. Devinの効率性: Devinめちゃくちゃ便利でした。寝る前に指示しておいて寝たり、子どもと花見中にSlackで依頼したり、って感じでざっくりスマートフォンだけでコードが完成しています。

Issue切って、Slackから依頼します。
Devinへの依頼

PRが数分ぐらいで上がってきます。
Devinのタスク完成

コードレビューをすると、自動で反応してくれて、自身で修正したりしてくれています。
DevinのPRレビューへの反応

大体こんな感じで、コードが進んでいきました。

完成までは、ざっくり$7ぐらい(20ACUのうち、7ACUぐらい使った)だったんじゃないかな、って思います。

たまーーーに、メモってるんですが、すっかり忘れちゃいます。w
https://github.com/TakahashiIkki/devin-mcp-uuid-sample/pull/2#issuecomment-2778750639

まとめ

とりあえずミリしらで進めたMCPServer開発なんですが、失敗しすぎたせいでより深く理解できました。

完成したプロジェクトはGitHubで公開していますので、興味のある方はぜひチェックしてみてください。

Discussion

ログインするとコメントできます