【ThoughtSpot】SpotterCodeをVS Codeで使ってみる

ThoughtSpotの組み込み開発用MCPサーバー「SpotterCode」をVS Codeで使う方法をご紹介します

 

AkimasaKajitaniです。今回はThoughtSpotのAIエージェント4兄弟のうちの一つ、SpotterCodeを使ってみたいと思います。

 

SpotterCodeとは?

SpotterCodeは、ThoughtSpotの組み込み機能やRestAPIなどのドキュメントを理解しているAIエージェント向けのMCPサーバーです。これを利用してAIがプログラミングする際の手助けをしてくれます。

また、ThoughtSpotの組み込みのドキュメント にもチャット形式で利用することができます。

正式対応しているIDEは、

  • Cursor AI
  • Visual Studio Code with GitHub Copilot
  • Claude Code

ですが、MCPサーバーに対応していればおそらく上記以外の環境でも利用が可能かと思います。

 

Visual Studio CodeでSpotterCodeを使ってみる

今回は、Visual Studio Code(以下VS Code)で使ってみます。

 

まず、VS CodeとSpotterCodeの統合が必要です。

VS Codeの上部検索バーをクリックし「Show and Run Commands」をクリックします。

 

 

ここで「MCP Add Server」をクリックします。

 

 

次に、「HTTP・・・」を選択します。

 

 

さらに、「https://spottercode.thoughtspot.app/mcp」と打ち込みます。

 

 

MCPサーバーの名前を聞かれるので好きなものを入力します。

 

 

次に、ワークスペースに紐づけるか、全体で使えるようにするか選択します。全体で使いたい場合は「Global・・・」を選択し、ワークスペースに紐づける場合は、「Workspace・・・」を選択します。

 

 

これで、mcp.jsonファイルが作られ、以下のようにMCPサーバーが登録されます。

 

 

途中で認証が入る場合は、実際に使っているインスタンスでログインをしてください。

いずれにしても、正式な方法は、ドキュメントを参照いただけたらと思います。

 

実際に何か作らせてみる

例えば、「ThoughtSpotの組み込みのサンプルを作りたい。WEBアプリの分析機能として組み込むイメージで、埋め込むガワの部分をおしゃれな作りにしてほしい。」というプロンプトからスタートしましたが、以下のようなデモサイトを作ってくれました。

 

 

このデモサイトは、右下のところにインスタンスのURLとライブボードのGUIDを入力して「Apply」を押せば、そのライブボードを表示してくれる、というものです。

 

SpotterCodeが使えれば、チャットでAIと会話するだけでサイトがいろいろと拡張できましたし、こういうことができないか?ということに対して、ベストプラクティスはこうです、と教えてくれたりで非常に便利でした。これを使うだけでかなり効率的に開発ができると思いますので、ぜひみなさま使っていただければと思います。

 

SpotterCode on WEB

SpotterCodeは、WEBのドキュメントでも利用できるようになっています。ThoughtSpotの開発者ドキュメントページ を見てみると、確かに右のほうにSpotterCodeが出てくるのがわかります。

 

ここでいろいろとわからないことを質問することも可能なので、VS Codeをお持ちでない方もWEBでなら利用することが可能です。

 

参考URL

  • SpotterCode | ThoughtSpot Developers Document

https://developers.thoughtspot.com/docs/SpotterCode

 

※2026/08/31時点の情報です

ThoughtSpotの導入はぜひKCCSで!

製品に対する操作方法、技術的な質問などは導入前・導入後に関わらずメールにてお答えします。また、ThoughtSpotを用いたビジュアライゼーション作成、組み込み開発、ヘルプデスク対応なども承りますので、お気軽にご相談ください。

おすすめの記事