Supabase MCPサーバーが公式から出てたので使ってみよう

Supabase MCPサーバーが公式から出てたので使ってみよう

Clock Icon2025.04.08

Supabaseは、オープンソースのバックエンドサービスで、PostgreSQLを基盤とし、以下のような機能を提供することで、アプリケーション開発を簡単にするツールです。

  • データベース: PostgreSQLを使用したリレーショナルデータベースで、SQLクエリが利用可能。トリガーやストアドプロシージャなど高度なデータ操作が可能。
  • 認証: GoogleやFacebookなどのソーシャルログイン、メール認証、電話認証など多様な方法をサポート。
  • リアルタイム機能: データ変更をリアルタイムで通知する機能を備え、チャットアプリやダッシュボードに最適。
  • ストレージ: 画像や動画などの大容量ファイルを効率的に保存・管理可能。
  • サーバーレス関数(Edge Functions): カスタムバックエンドロジックを簡単に実装できる。

私自身は個人開発でよく利用しています。便利ですとても。

そのSupabaseからMCPサーバーが提供されるようになったので、実際に接続して使ってみます。

Supabase MCPサーバーを接続

SupabaseはのMCPサーバーはAIツールをSupabaseに接続し、データベースの起動、テーブルの管理、構成の取得、データのクエリなどのタスクを実行できるようにします。

設定方法

接続に必要なものとして、

SupabaseのPersonal access token、MCPクライアントの設定ファイル があります。

  1. Personal access token
    Supabase settings ページで作成します。

スクリーンショット 2025-04-08 13.48.45

Generate new tokenから新規作成します。

  1. MCPクライアントの設定ファイル

CursorやClaudeデスクトップなどのMCPクライアントが提供されているツールで、以下のJSONフォーマットで設定ファイルを作成して接続できます。

{
  "mcpServers": {
    "supabase": {
      "command": "npx",
      "args": [
        "-y",
        "@supabase/mcp-server-supabase@latest",
        "--access-token",
        "<personal-access-token>"
      ]
    }
  }
}

今回はClaudeデスクトップでやってみます。

設定->開発者項目から

スクリーンショット 2025-04-08 14.02.18

構成を編集 を押すと設定ファイルを選択した状態でフォルダが開きますので、そのファイルを開いて上記の設定を追加します。

設定後、Claudeデスクトップを再起動し、接続が成功していれば利用可能なMCPツールが増えていると思います。

スクリーンショット 2025-04-08 14.09.39

スクリーンショット 2025-04-08 14.09.54

SupabaseのMCPサーバーで提供されているツールが表示されていますね、

使ってみる。

(ツール)[https://github.com/supabase-community/supabase-mcp/tree/main?tab=readme-ov-file#tools]

SupabaseのMCPサーバーでは、2025.4.8時点で以下のツールが提供されています。

Project Management

  • list_projects: ユーザのすべてのSupabaseプロジェクトをリストアップする
  • get_project: プロジェクトの詳細を取得する
  • create_project: 新しいSupabaseプロジェクトを作成する
  • pause_project: プロジェクトを一時停止する
  • restore_project: プロジェクトを復元する
  • list_organizations: ユーザーが所属する組織を一覧表示します
  • get_organization: 組織の詳細を取得する

チャットからプロジェクト管理系のツールを動かしてもらってみました。

スクリーンショット 2025-04-08 14.21.29

スクリーンショット 2025-04-08 14.24.14

プロジェクト作ってと言えば、コストの確認もしてくれましたね、便利。

Database Operations

  • list_tables: 指定したスキーマ内のすべてのテーブルをリストアップします
  • list_extensions: データベース内のすべての拡張モジュールをリストします
  • list_migrations: データベース内のすべてのマイグレーションを一覧表示します
  • apply_migration: データベースにSQLマイグレーションを適用します。このツールに渡された SQL はデータベース内で追跡されるので、LLM は DDL 操作 (スキーマの変更) にこれを使うべきです
  • execute_sql: データベース内で生のSQLを実行する。LLMはスキーマを変更しない通常のクエリにこれを使うべきです
  • get_logs: Supabase プロジェクトのログをサービスタイプ (api, postgres, edge functions, auth, storage, realtime) ごとに取得します。LLMはこれを使用して、デバッグやサービスパフォーマンスの監視を行うことができます

データベースの操作を行えます。

試しに、株価データを保存するためのテーブルを作ってもらいました。

スクリーンショット 2025-04-08 14.53.02

apply_migrationのツールが実行されて作成されるようですね、

サンプルデータも追加してもらいます。

スクリーンショット 2025-04-08 14.58.22

execute_sqlのツールが実行されていますね。

Project Configuration

  • get_project_url: プロジェクトの API URL を取得します
  • get_anon_key: プロジェクトの匿名APIキーを取得します

APIのURLを聞いてみました。

スクリーンショット 2025-04-08 15.24.41

Branching (Experimental, requires a paid plan)

  • create_branch: プロダクションブランチからのマイグレーションを含む開発用ブランチを作成します
  • list_branches: すべての開発ブランチを一覧表示します
  • delete_branch: 開発ブランチを削除します
  • merge_branch: 開発ブランチを削除します: マイグレーションとエッジ関数を開発ブランチから本番環境にマージします
  • reset_branch: 開発ブランチのマイグレーションを以前のバージョンにリセットします
  • rebase_branch: マイグレーションドリフトを処理するために開発ブランチを本番環境にリベースします

ブランチ操作ができるようですが、有料プランに加入しないといけませんでした。

スクリーンショット 2025-04-08 15.29.23

コストの確認を行なった後、create_branchのツールを実行しましたが、私のアカウントがFreeプランのため実行できませんでした。

Development Tools

  • generate_typescript_types: データベーススキーマに基づいてTypeScriptの型を生成する。LLMはこれをファイルに保存し、コードで使用することができる

スクリーンショット 2025-04-08 15.38.11

型定義の生成をgenerate_typescript_typesツールによって行われていますね。

Claudeでさらにこの生成した型定義のファイルを使ったサンプルコードの作成も行なってくれています。

Cost Confirmation

get_cost: 組織の新規プロジェクトやブランチのコストを取得する
confirm_cost: ユーザーが新規プロジェクトやブランチのコストを理解しているか確認します。新規プロジェクトやブランチを作成する際に必要です

作成したプロジェクトにかかっているコストを調べてもらいます。

スクリーンショット 2025-04-08 15.54.30

get_costツールを実行してコストを返してくれますね。


ClaudeデスクトップとSupabaseのMCPサーバーを接続して使用してみました。
ソフトウェアエンジニアの人たちだとCursorから繋げて、AIアシスタントと対話しながら開発を行うことができるようになるので便利そうですね。

公式ブログの(Whats Next)[https://supabase.com/blog/mcp-server#whats-next]によると、
Edge関数を作成してデプロイする、ネイティブ認証、ファイルストレージの操作もテキストプロンプトから可能になる予定とのことです。

ネイティブ認証は今回使ったPersonal Access tokenを使わず、OAuth2のログインフローを使って認証されるようになるので設定が楽になりそうです。

Share this article

facebook logohatena logotwitter logo

© Classmethod, Inc. All rights reserved.