5,021 文字
ここ数日間旅行していた間に、GoogleがGemini 2.5モデルをリリースしました。まだ試す時間がなかったので、今日の動画ではGemini 2.5を使って、Cursor MCPサーバーを構築してみようと思います。私が普段セットアップするワークフローに従い、あなた自身の特定のニーズに合わせたMCPサーバーの構築方法を学べるようにしていきます。
今日は、OpenAIのベクトルストアを持つMCPサーバーを構築したいと思います。そこにドキュメントを保存して、Cursorが常に最新の情報を持つようにします。どんなトピックでも、必要な最新のドキュメントを常に持つことができます。すでに3jsドキュメントのベクトルストアを構築したのでそれを使ってもいいですし、これらのベクトルストアを構築する際に使うワークフローと、それをMCPサーバーに接続する方法をお見せすることができます。
まずはGoogle AI Studioで始めましょう。Gemini 2.5 Pro実験版を選びます。最初にやることは、MCPサーバーを実際に構築するために、Geminiに必要なコンテキストを集めることです。
しかしその前に、今日のスポンサーであるbrilliant.orgをご紹介します。ChatGPTや生成AIモデルなどのAIが実際にどのように機能するか疑問に思ったことはありませんか？brilliant.orgには、その仕組みを覗ける完璧なコースがあります。個人的に今のお気に入りは「AIの仕組み」コースです。これは、大規模言語モデル入門、次の単語の予測、より大きなコンテキストウィンドウ、勾配降下法、さらには独自の大規模言語モデルの構築などのトピックを案内してくれます。
Brilliantの素晴らしい点は、ただ受動的に視聴するだけでなく、複雑なトピックをシンプルで直感的にする対話型レッスンに積極的に取り組むことができる点です。Brilliantのアプローチは、単に講義を見るだけよりも6倍効果的であることが証明されています。深い理解を築き、問題解決能力を高めることができます。キャリアのためにスキルを磨きたい場合でも、単にAIについて知りたい場合でも、Brilliantは毎日ほんの数分でよりスマートに学ぶのに役立ちます。
AIがどのように機能するかを探求し、Brilliantが提供する何千もの対話型レッスンを体験するには、brilliant.org/allaboutaiにアクセスするか、画面上のQRコードをスキャンしてください。説明欄のリンクをクリックして30日間の無料トライアルを開始してください。最初の200人の登録者は、年間プレミアムサブスクリプションが20%オフになります。このビデオのスポンサーとなったBrilliantに感謝します。
プロジェクトに戻りましょう。まずドキュメントを集めていきます。Cursorについての情報を取得します。ドキュメントに必要なコンテキストをすべて取得しましょう。このページをコピーして、サーバーをTypeScriptで構築したいので、Node.jsを選択します。
少し情報を準備しました。Gemini用のファイルを作成しましょう。「cursor-mcp.txt」という名前にします。MCPサーバーをCursorでどのように構築し、セットアップするかについての情報をGeminiに貼り付けます。また、MCP TypeScript SDKからのドキュメント情報も取得したいと思います。このドキュメントをすべてコピーして、「typescript-mcp.txt」という名前の新しいファイルを作成し、このドキュメントを貼り付けます。
もちろん、OpenAIからの情報も必要です。ドキュメントページに行って、テキストと生成プロンプトのドキュメントを取得しましょう。これを「openai1.txt」と呼びましょう。ドキュメントをここに貼り付けます。新しいファイルを作成して、「openai-file-search.txt」と呼びましょう。ベクトルストアを使用する際にこのドキュメントが必要になります。OpenAIページのドキュメントに戻り、ファイル検索ドキュメントを取得します。便利なコピーページがあるのでそれを使用します。それを貼り付けて、これでGeminiがMCPサーバーを構築するために必要なすべてのドキュメントが揃いました。
次に、ベクターデータベースを準備しましょう。どのタイプのベクターデータベースを構築したいか考えましょう。3jsのドキュメントを再構築することにします。OpenAIのストレージでベクターストアを作成するには、「作成」をクリックして名前を付けます。「3js-docs-2」と呼びましょう（すでにバージョンを持っているので）。
次に「ファイルを追加」をクリックして、必要なファイルを定義します。私のベクターストアを構築したい場合は、説明欄のリンクに行って、3jsのドキュメントからすべてのテキストファイルをアップロードしました。これには、Vibe codingやゲーム構築に非常に役立つドキュメントがすべて含まれています。
3jsファイルをベクターストアにアップロードしましょう。git cloneを使ってファイルを取得し、それらをベクターストアにドラッグします。詳細オプションでチャンクサイズを2000に設定し、オーバーラップを400に設定します。これは、5つのチャンクを抽出した場合、各チャンクのサイズを示しています。「添付」をクリックすると、ベクターストアが構築されます。かなり速いですね。名前を保存すると、後で使用する必要のあるIDが表示されます。
これでベクターストアがセットアップできました。次に、このベクターストアを使用できる実際のサーバーを構築する必要があります。Google AI Studioに戻り、2.5モデルを使います。準備したファイルをアップロードする必要があります。ここにドキュメントやコンテキストがあります。
プロンプトを考えましょう。「OpenAIのファイル検索ベクターストア機能を使用するCursor MCPサーバーをTypeScriptで作成しましょう。必要なツールは、ファイル検索をクエリしてベクターストアからチャンクをコンテキストとして返すことができるものです。コードを書いて、これを設定するためのステップバイステップガイドを作成してください。」
これが私たちがやろうとしていることです。フルコンテキストを追加したので、実行してGemini 2.5が私たちのセットアップを手伝ってくれることを期待しましょう。これは思考・推論モデルなので、ステップを見ることができます。速度にはかなり満足しています。結果を待ちましょう。
完璧です。ステップバイステップのガイドが表示されました。これに従っていきましょう。Nodeはインストール済みなので、ディレクトリを作成します。「2」と呼ぶことにします。このディレクトリをCursorで開きましょう。ターミナルも開いて、まず初期化します。パッケージを取得しました。
次に、いくつかの依存関係をインストールします。Cursorに統合されていないため、コピーと貼り付けが多くなりますが、この例では問題ないでしょう。ルートにconfig.jsonを作成し、そのコードを取得します。
作成する構造はsource/index.ts、types.ts、.envなどです。この構造をセットアップしましょう。構造ができたので、コードを取得していきます。.envファイルにはベクターストアIDとOpenAIキーが必要です。.gitignoreも作成し、types.tsをコピーして貼り付け、保存します。index.tsは私たちが構築するメインファイルなので、それをコピーして貼り付け、保存します。
package.jsonを作成し、ビルドしてリンクします。すべてをセットアップして、変更が必要かどうか確認しましょう。ビルドを試みましょう：「npm run build」
エラーがありますね。このエラーをコピーしてGemini 2.5でデバッグしましょう。エラーを貼り付けて実行すると、いくつかの問題があることがわかります。修正されたindex.tsを取得して、それを貼り付けましょう。もう一度ビルドを試みると、うまくいきました。「npm link」を実行します。
これで準備ができました。.cursorという新しいフォルダを作成し、mcp.jsonというファイルを作成する必要があります。MCPの接続をセットアップするためのJSONファイルが必要です。Gemini 2.5がそれを用意しているか見てみましょう。
ここにmcp.jsonがあります。キーは隠しますが、APIキーを入れる必要があります。このJSONファイルでは、ビルドしたindex.jsを指定し、APIキーとベクターストアIDが必要です。OpenAIに戻ってストレージに行き、IDをコピーします。ベクターストアIDを貼り付け、OpenAIキーを取得して入力します。
これでCursorを一度閉じて再度開いてみましょう。設定に行き、MCPを有効にすると、OpenAIファイル検索と3jsドキュメント検索が表示されました。試してみましょう。
チャットを開いて、「3jsドキュメントでフォグを作成する方法を教えて」というプロンプトを入力し、エージェントを選択して実行します。MCPツールに接続し、クエリを送信して、ツールを実行します。そのクエリをベクターストアに送信し、3jsドキュメントからフォグに関するすべての情報を取得しようとします。これをコンテキストとして返します。
結果が表示されました。3jsドキュメントに基づいて、フォグを作成する方法は2つあります。線形フォグがあり、そのパラメータがあります。これにより、ベクターストアから取得した価値あるドキュメントがCursorに表示されます。ベクターストアから取得したすべてのコンテキストが表示されています。
エージェンティックワークフローを設定する場合、作業したいライブラリのドキュメントを持つMCPサーバーをセットアップすることは本当に役立ちます。ドキュメントは常に変更され、新しいバージョンが出るため、この情報をCursorやCodeWin、Surfなどのクライアント側IDに供給することで、ドキュメントを使ったセットアップでより良い結果が得られます。
OpenAIドキュメントや3jsドキュメントを持つ多くのMCPサーバーを構築しましたが、セットアップは非常に簡単です。今日ここでのガイドに従うだけです。Gemini 2.5 Proを使ってとても満足しています。このモデルをさらに探求することにワクワクしていて、他のプロジェクトでも試してみる予定です。おそらく近いうちにCursorに組み込まれるかもしれませんし、Surfなどの他のクライアントでも使用できるかもしれません。
このモデルの素晴らしい点は、トークン数が巨大で、速度が素晴らしいことです。ベンチマークを簡単に見てみましょう。LiveBenchを見ると、コーディング平均で85.8%というスコアがあります。これはトップで、Claude 3 O3 Miniやクロード 3.5 Sonnetを大きく上回っています。このモデルをさらに探索するのがとても楽しみです。Googleは本当に巻き返してきましたね。1年前には多くの人が見限っていましたが、最近は非常に良い復活を遂げています。
このモデルをさらにテストするのが楽しみです。今日何か学ぶことがあったら嬉しいです。これらのサーバーを作成するのはかなりクールで、私は本当にMCPのファンです。次の動画では、OpenAIもMCPを採用したので、それについてもっと掘り下げていく予定です。このチャンネルの次の動画をお楽しみに。
ご視聴いただきありがとうございます。もう一つだけ、NVIDIA GPUの抽選はおそらく今週末に行われますので、GPUを獲得するチャンスに参加した方は、今週末の結果をお楽しみに。ご視聴いただきありがとうございます。またお会いしましょう。良い一日を。
コメント