Roo-Cline 開発効率化ガイド Part.3：自然言語指示でMCPサーバーを作る 🚀

はじめに

前回の記事では、Roo-Clineの自動化設定について解説しました。コマンドの自動承認やファイル操作の自動化により、開発フローを大幅に改善できることをご紹介しました。

今回は、その自動化機能を活用した具体的な開発例として、自然言語での指示だけでModel Context Protocol (MCP) サーバーを作成・デプロイする方法をご紹介します。MCPは、AIアシスタントに新しい機能を追加できる便利なツールですが、開発には専門的な知識が必要でした。

Roo-Clineの自動化機能を使えば、「サイコロのMCPを作成して、GitHubとnpmにデプロイして」という一行の指示だけで、完全なMCPサーバーを構築できます。それでは、実際の開発フローを見ていきましょう。

Roo-Clineのおさらい

前回ご紹介したように、Roo-ClineはClineをベースに開発された革新的な自律型コーディングアシスタントです。主な特徴は以下の通りです：

• コマンドの自動承認機能
• ファイル操作の自動承認機能
• プロジェクト固有の指示を.clinerulesで設定可能
• サウンドエフェクトのサポート
• プロンプトのコピー機能
• MCPツールの自動承認機能

今回は、これらの機能の中でも特に自動承認機能に焦点を当て、実践的な開発フローをご紹介します。

実装の流れ

roo-clineでMCPサーバーをフルオートで作ってみる①
取り敢えず9割地点まではフルオートでいけた！
✅MCPの作成
✅READMEの作成
✅Githubのリポジトリ作成＋Push
最後の細かいバグとデプロイまだもうちょい！ https://t.co/rNw3V4VY7i pic.twitter.com/Qgoz3dLnFT

— Maki@Sunwood AI Labs. (@hAru_mAki_ch) December 15, 2024

1. プロジェクト作成

まず、Roo-Clineに「サイコロのMCPを作成して、githubとnpmにデプロイして」と指示を出します。Roo-Clineは以下のコマンドを実行してプロジェクトを作成します：

npx @modelcontextprotocol/create-server dice-server -n "dice-server" -d "サイコロを振るためのMCPサーバー"

2. パッケージ設定

次に、Roo-Clineはpackage.jsonを編集して、必要な設定を追加します：

• パッケージ名の設定（@makimaki/dice-server）
• バージョン管理情報の追加
• 依存関係の設定
• npm公開用の設定

3. MCPサーバーの実装

TypeScriptを使って、サイコロを振るMCPサーバーの実装を行います：

// サーバークラスの定義
class DiceServer {
  private server: Server;

  // サーバーの初期化
  constructor() {
    this.server = new Server(
      {
        name: 'dice-server',
        version: '0.1.0',
      },
      {
        capabilities: {
          tools: {},
        },
      }
    );

    this.setupToolHandlers();
  }

  // ツールハンドラーの設定
  private setupToolHandlers() {
    // サイコロを振るAPIの定義
    this.server.setRequestHandler(ListToolsRequestSchema, async () => ({
      tools: [
        {
          name: 'roll_dice',
          description: 'サイコロを振って結果を返します',
          inputSchema: {
            type: 'object',
            properties: {
              sides: {
                type: 'number',
                description: 'サイコロの面の数（デフォルト: 6）',
                minimum: 2,
              },
              count: {
                type: 'number',
                description: '振るサイコロの数（デフォルト: 1）',
                minimum: 1,
                maximum: 10,
              },
            },
          },
        },
      ],
    }));
  }
}

4. GitHubへのデプロイ

Roo-Clineは、GitHubにリポジトリを作成してコードをプッシュします：

gh repo create dice-server --public --description "サイコロを振るためのMCPサーバー" --source=. --remote=origin --push

5. NPMへの公開

最後に、NPMにパッケージを公開します：

npm publish --access public

使用方法

作成したMCPサーバーは以下のように使用できます：

1. インストール：

npm install @makimaki/dice-server

1. Claude.appの設定ファイルに追加：

{
  "mcpServers": {
    "dice": {
      "command": "dice-server",
      "env": {}
    }
  }
}

1. Claudeでの使用例：

roll_diceツールを使用して、6面ダイスを2個振ってください。

Roo-Clineの処理フロー解説

Roo-Clineは以下のような流れで処理を実行しました：

1. 要件分析

   • 自然言語指示を解析し、MCPサーバーの作成とデプロイが必要だと理解
   • 必要なステップを特定（プロジェクト作成→実装→GitHub/NPMデプロイ）

2. プロジェクトセットアップ

   • MCPサーバーテンプレートを使用してプロジェクトを作成
   • 必要な依存関係を自動でインストール

3. コード生成

   • TypeScriptの型定義を確認しながら実装
   • エラーハンドリングやバリデーションを適切に追加
   • コメントを日本語で追加し、可読性を向上

4. デプロイ処理

   • GitHubリポジトリの作成とプッシュを自動化
   • NPMへの公開プロセスを実行

5. エラー対応

   • TypeScriptのコンパイルエラーを検出して修正
   • 依存関係の問題を解決

まとめ

Roo-Clineを使用することで、MCPサーバーの作成からデプロイまでを自然言語での指示だけで完了できました。これにより、開発者はより本質的な機能の設計に集中できるようになります。

今回作成したサイコロMCPサーバーは、シンプルながらMCPの基本的な機能を理解するのに最適な例となっています。また、Roo-Clineの自動化機能により、開発効率が大幅に向上することも確認できました。

参考リンク

• Roo-Cline GitHub
• Model Context Protocol
• 作成したサイコロMCPサーバー