00:00:00ここ2ヶ月間、AIコミュニティはMCPにある大きな問題があることに気づき始めていました。
00:00:04そして、この問題に対して、コミュニティから実際にいくつかの解決策が提案されました。
00:00:08しかし、それらすべての解決策には大きな欠落があったのです。
00:00:10少し前に、私たちはDockerの解決策についての動画を作成しました。
00:00:12それは、これまでのMCP問題に対する最善の解決策だと考えていました。
00:00:16Dockerは、エージェントがMCPツールを直接呼び出すJavaScriptコードを書ける「コードモード」をリリースしました。
00:00:21これにより、ツールの説明がコンテキストウィンドウに表示されることで、
00:00:24MCPツールが大量のコンテキストを消費してしまうという問題が解決されました。
00:00:27多くのMCPを使用していると、ほとんどの場合必要のない
00:00:32不要なツールによって、コンテキストウィンドウが肥大化してしまいます。
00:00:36しかし、Docker MCPゲートウェイでは、Dockerが設定したMCPに縛られてしまい、
00:00:41ローカルおよびリモートのMCPに制限がありました。
00:00:43また、それらのカスタムツールを関数として保存することもできませんでした。
00:00:47これらすべては、Cloudflareがこの問題を特定し、ツールをコンテキストに置くのではなく、
00:00:51実行可能なコードとして存在させる解決策を提案したことから始まりました。
00:00:56このプロトコルの開発元であるAnthropicも、自社製品におけるこの欠落を認め、
00:01:00まさにこの問題を指摘する論文をリリースしました。
00:01:04その後、人々はこの問題を真剣に捉え、解決策の模索を始めました。
00:01:09しかし、すべてのツールをTypeScriptファイルに変換するという彼らの解決策にも欠点があります。
00:01:13多くのMCPを接続している場合、一つずつ個別にコードへ変換する必要があり、
00:01:18その過程でエラーが起きないよう確認するのにも多大な時間を要します。
00:01:22しかし、これが周知の問題となったため、
00:01:24人々は今もより良い解決策を生み出そうとしています。
00:01:26そこで見つけたのが、この「MCP to CLI」という新しいツールです。
00:01:30MCP to CLIは、すべてのMCPサーバーをbashコマンドで実行できるCLIツールに変えることで、
00:01:36MCP特有のコンテキスト肥大化の問題を解決します。
00:01:40私たちのチームでは主にCloud Codeを使用していますが、これには問題の一部を解決するCLIフラグがあります。
00:01:45そのツールは、すべてのツールをあらかじめコンテキストウィンドウに公開しないことで、
00:01:50初期のMCPコンテキスト肥大化を解決します。Cloud Codeが必要に応じて各ツールを動的にロードできるようにするのです。
00:01:55しかし、Cloud Codeにはまだ別の問題が残っています。ご存知の通り、
00:02:00MCPは出力を直接コンテキストウィンドウに返します。MCPツールから巨大な出力が
00:02:05返された場合、それはそのままコンテキストウィンドウに残り、
00:02:10不必要なコンテキストの肥大化を招いてしまいます。また、「CLI Hub」のような
00:02:15同じ問題をターゲットにした他のオープンソースツールを聞いたことがあるかもしれませんが、
00:02:20それらは実行時ではなくビルド時に変換を行うため、非効率的です。では「実行時（ランタイム）の変換」とはどういう意味でしょうか？
00:02:25それは、ツールが実際に呼び出された瞬間にbashコマンドに変換されることを意味します。
00:02:29これだけなら普通に聞こえるかもしれませんが、元のMCP自体が更新されたらどうなるでしょうか？
00:02:34このツールは実行時にMCPツールを構築するため、実際のMCPへの変更は自動的に変換後のツールに反映されます。
00:02:39ビルド時にツールを作成していたら、このようなことは不可能です。
00:02:43その場合、毎回手動でツールを取得し、更新しなければならなかったでしょう。
00:02:48しかし、呼び出されるたびに同じツールを変換すると、繰り返しの呼び出しが遅くなると思うかもしれません。
00:02:53そこで、ツールに組み込まれたキャッシュ機構の出番です。これはすべてのMCPツールを、
00:02:58デフォルトで1時間の有効期限（TTL）を持たせてキャッシュに保存します。頻繁に使用されるMCPツールは
00:03:03キャッシュに直行して1時間保持されます。これにより、エージェントは実行時の柔軟性を損なうことなく、
00:03:08より高速にツールを取得できるようになります。このツールは、すべてのMCPサーバーが内部で使用している
00:03:13「MCP Python SDK」の真上に構築されています。そのため、すべてのMCPツールの呼び出しを
00:03:19単なるbashコマンドとして実行し、指示された時だけレスポンスをエージェントの
00:03:24コンテキストウィンドウに注入します。また、OpenAPIやREST APIも同じCLIインターフェースで処理できるため、
00:03:30MCPサーバーがない既存のAPIであっても、全く同じ方法で使用することができます。
00:03:35このツールがなければ、接続できるMCPの種類は限られてしまいます。
00:03:39他の同様のソリューションでは、通常、あらゆるタイプのMCPを1か所で扱えるほどの
00:03:44柔軟性はありません。トークン効率に関する主張を裏付けるために、彼らはトークン数を計測する
00:03:49Pythonライブラリ「tiktoken」を使用して自動テストスイートを実行しました。テストの結果、
00:03:54このツールははるかに安価で、実行速度も大幅に速いことが証明されました。私たちの言葉を鵜呑みにする必要はありません。
00:03:59このツールには、裏付けとなる実際の数値があるのです。システムにpipでインストールするか、
00:04:03インストールせずに実行することも可能です。作業環境をクリーンに保つため、私たちはインストールせずに実行することを選びました。
00:04:07また、エージェントがこのツールをより上手く扱えるようにする「スキル」も提供されています。
00:04:13これはコアとなるワークフローを規定し、認証やキャッシュなど、エージェントがコンテキストを持っていない
00:04:18様々なタスクに対するbashコマンドの例を提示します。しかし、先に進む前に、
00:04:22スポンサーの「Orchids」についてお伝えさせてください。ほとんどのAIビルダーは単純なモックアップは得意ですが、
00:04:27複雑なロジックやマルチファイル構造が必要になると失敗します。そこでOrchidsの登場です。
00:04:32Orchidsは、あなたの環境から直接、あらゆるスタックであらゆるアプリを構築・デプロイできる初のAIエージェントです。
00:04:36既存のChatGPT、Claude、Gemini、さらにはGitHub Copilotのアカウントを使って、
00:04:41モデルを原価で実行できます。あらゆるスタック上のあらゆるアプリを処理できるように設計されており、Webに限定されません。
00:04:47モバイルアプリやChrome拡張機能から、複雑なAIエージェントや
00:04:52Slackボットまで、あらゆるものを構築・デプロイできます。こちらの事例をご覧ください。複雑なハードウェアレベルのロジックを管理する
00:04:57完全に動作するOpenClawのセットアップ、膨大なライブデータフィードをリアルタイムで処理する機能的なブルームバーグ端末、
00:05:02そしてデバイスのカメラフィードを直接活用する、この建物識別器のような
00:05:07ネイティブモバイルアプリです。固定コメントのリンクをクリックして構築を始めましょう。コード「March 15」でプランが15%オフになります。
00:05:12皆さんと同じように、私たちも豊かになりたいと考えています。その一つの方法は、市場の隙間に気づくことです。
00:05:17そこで思いついたのが「馬専用のGrindr」という黄金のアイデアです。…冗談はさておき、
00:05:22大規模な製品を構築するには、多くの依存関係があり、コンテキストウィンドウをすぐに使い果たしてしまうため、
00:05:27多くのMCPツールが必要になります。バックエンドのインフラとして使用していたため、
00:05:34MCP to CLIを使ってエージェントをSupabaseのMCPに接続しました。先ほどインストールした
00:05:38スキルのおかげで、手動で設定する必要は一切ありません。そのスキルがすべてを自動で処理し、
00:05:43MCPの設定を行ってくれます。ただし、いきなりインストールする前に、
00:05:47使用するMCPのアクセストークンを取得しておく必要があります。そうしないと、
00:05:52私たちがしたようにエラーが発生します。トークンを生成し、Claudeに渡して追加してもらいました。
00:05:57正しく設定されると、使用可能なツールが表示されるはずです。ここで、bashコマンドとして実行する場合、
00:06:01プロセスがリストアップされた際にAPIキーやトークンなどの機密データが露出してしまい、
00:06:06安全ではないと思うかもしれません。しかし、このツールには保護レイヤーがあります。
00:06:11機密データをコマンドライン引数には入れません。代わりに、環境変数を通じて処理するか、
00:06:15アクセストークンが保存されているファイルパスを参照するか、シークレットマネージャーを使用して
00:06:21実行時に注入します。そのため、安全に実行できます。Supabaseの接続と同様に、
00:06:26バージョン管理用にGitHub MCP、ブラウザテスト用にPuppeteer MCP、そしてエージェントに
00:06:32適切なドキュメントを参照させて最新のドキュメントで動作させるためにContext 7 MCPを接続しました。
00:06:37すべてのMCPが接続された後、Claudeにすべてを検証するよう依頼しました。
00:06:42今回のケースでは、4つのMCPが接続され、合計78のツールが利用可能であることが確認されました。また、
00:06:47私たちのコンテンツを楽しんでいただけているなら、ぜひハイプボタンを押してください。より多くのコンテンツを作成し、拡散する励みになります。
00:06:52接続が完了したので、いよいよアプリを段階的に実装していきます。
00:06:57まずはクライアント側のコードをSupabaseのバックエンドに接続することから始めました。
00:07:02ClaudeがMCP to CLIコマンドを実行してプロジェクトを作成した際、ツール呼び出しに
00:07:07アクセストークンを直接含めていないことに気づきました。代わりに、プロジェクトレベルの .env.local を
00:07:12トークンの参照先として使用していました。プロジェクトを作成してすべてをセットアップし、接続ロジックをコードに追加しました。
00:07:17しかし、セッション更新のロジックにミドルウェアファイルが使われていることに気づきました。これは非推奨のはずです。
00:07:22Next.jsの新しいバージョンではプロキシを使用するため、実際にアプリを実行した際に
00:07:27エラーが出ることは分かっていました。これは、単にツールを接続するだけでは、
00:07:31エージェントがそのツールに従い、必要な時に適切に使用させるには不十分であることを示しています。
00:07:36そこで、claude.mdファイルを作成し、コードを書く前にContext 7 MCPを使用するよう指示しました。
00:07:42これで同じ間違いは起きません。実装前にContext 7 MCPを参照すべきだと学習したからです。
00:07:47Supabaseでのテーブル追加と認証設定が終わった後、Claudeに非推奨のミドルウェアの警告を指摘し、修正させました。
00:07:52指示を出した後、ClaudeはようやくContext 7 MCPを使用してドキュメントを取り込み、
00:07:57問題を適切に解決しました。しかし、このツールをさらに調べていくうちに、
00:08:03claude.mdファイルを作成するよりも良い解決策があることが分かりました。
00:08:07「スキル」の方が優れています。なぜなら、その説明がエージェントのコンテキストに直接ロードされるからです。
00:08:11そのため、単にclaude.mdに指示を放り込んで読んでくれるのを期待するよりも、
00:08:16どのツールが利用可能で、いつ使うべきかをエージェントが最初から把握できます。
00:08:21そこで、接続したすべてのMCPに対してスキルを作成するよう依頼しました。するとClaudeは
00:08:26各MCPのスキルを作成しました。それぞれにどんなツールがあり、どのように、いつ使うべきかが詳細に記されています。
00:08:32これで準備は整いましたが、まだ実用的とは言えませんでした。
00:08:36馬たち（ユーザー）からのフィードバックでは、プラットフォーム上で直接チャットができないため、しびれを切らしているとのことでした。
00:08:41そこでClaudeに、UIだけでなくプロジェクトのチャット機能を実用化するよう依頼しました。
00:08:46自分たちでテストしたところ、メッセージが読み込まれず、ローディング画面のままでした。
00:08:51そこで、Puppeteer MCPを使ってメッセージの流れをテストするよう依頼しました。エージェント自身にチェックさせたのは、
00:08:56自身でクリックやスクロールをしてUIを操作できるエージェントは、静的なコードレビューでは決して見つけられないバグを発見できるからです。
00:09:01テスト用に2人のユーザーを作成しましたが、各ツール呼び出しで新しいブラウザインスタンスが立ち上がるため、
00:09:06セッションデータを維持することができませんでした。使用したツールの数と、
00:09:10ヘッドレスブラウザでの作業にかかった時間を見て、あることに気づきました。もっと良い選択肢は、
00:09:15単にMCPに処理させることでした。その方がはるかに速く、このような単純なタスクに費やした7分間よりも短時間で済みました。
00:09:21私たちは、より多機能で、このようなエンドツーエンドのテストにおいてセッション維持能力が高い
00:09:25Claude自身のブラウザ拡張機能を使う方を好みます。一方、
00:09:30MCPは永続的なプロセスとして実行されるため、セッション全体で状態を維持することができます。
00:09:35このツールはまた、JSONや生の出力など、出力形式の制御も提供しています。
00:09:40さらに、LLMの消費に適したトークン効率の良いコーディングフォーマット「TOON」もサポートしています。
00:09:46Context 7のようなMCPを使用すると、通常、巨大な出力の塊がコンテキストウィンドウに直接返されます。
00:09:51それを防ぐために、claude.mdファイルに、Context 7 MCPを使用する際は常に
00:09:57TOON形式で出力するよう指示を追加しました。これは、インデントとCSVスタイルのリストを組み合わせて、
00:10:02大量の情報をJSONやYAMLよりもはるかにコンパクトにまとめる効率的な形式です。これにより、不必要にトークンを浪費することを防げます。
00:10:07しかし、最大のブレイクスルーは、MCPがエージェントによってネイティブに処理されていた時には不可能だったことから生まれました。
00:10:12Cursorが製品内でコンテキスト編集ワークフローをリリースしたのを覚えているでしょうか。
00:10:16彼らはMCPの結果をファイルとして扱い、エージェントがgrepのようなbashスクリプトを使って
00:10:22パターンマッチングでデータを抽出できるようにしました。これについては前回の動画で取り上げました。
00:10:27このアイデアを他のコーディングエージェントでも実装しようとしましたが、MCPがエージェントによってネイティブに処理されるため、
00:10:32あまり成果が得られませんでした。しかし、このCLIがあれば可能です。なぜなら、
00:10:37MCPがbashコマンドツールとして扱われるからです。そこで、claude.mdファイルに、
00:10:43MCPツールが大きな出力を生成する場合は、コンテキストウィンドウにロードするのではなく、
00:10:49指定したパスのファイルにリダイレクトするよう指示を追加しました。私たちはこのプロジェクトの進捗を
00:10:54progress.jsonファイルで追跡していました。指示を追加した後、Claudeにリストから1つの機能を実装するよう依頼しました。
00:10:59するとClaudeはContext 7 MCPを使用してツールを呼び出しましたが、出力をコンテキストウィンドウに
00:11:05ダンプする代わりにファイルにパイプし、grepを使ってデータを抽出して実装を完了させました。
00:11:10このツールを使用するためのベストプラクティスをまとめたclaude.mdファイルは、AI Labs Proで公開しています。
00:11:16AI Labs Proは最近立ち上げたコミュニティで、今回の動画や過去の動画で紹介した
00:11:20プロジェクトにそのまま使えるテンプレートを提供しています。私たちの活動に価値を感じ、
00:11:25チャンネルを支援したいと思っていただけるなら、これが最善の方法です。リンクは概要欄にあります。
00:11:29これで今回の動画は終わりです。もしチャンネルを応援し、
00:11:33このような動画制作を続けてほしいと思っていただけるなら、下の「スーパーサンクス」ボタンから支援をお願いします。
00:11:38いつものように、ご視聴ありがとうございました。また次の動画でお会いしましょう。