Supabase入門2026｜認証・DB・AIを無料で始める全手順

個人開発やMVP構築で「バックエンドをどうするか」は最初に突き当たる壁だ。PostgreSQLのセットアップ、認証の実装、ファイルストレージの構築。これらを一から組むと、フロントエンドに触れる前に数日が消える。

Supabaseはこの問題を丸ごと引き受けるオープンソースのBaaS（Backend as a Service）だ。Firebase対抗として2020年に登場し、2026年現在はGitHub Stars 78,000超、Vibe CodingツールのLovableやBolt.newとの統合でも存在感を増している。無料枠でプロジェクトを2つまで動かせるので、この記事を読みながら実際に触ってみてほしい。

Supabaseとは - PostgreSQLベースのオープンソースBaaS

Supabase（スパベース）は、PostgreSQLを中核にしたバックエンド基盤だ。データベース、認証、ストレージ、リアルタイム通信、サーバーレス関数、ベクトル検索の6機能をブラウザのダッシュボードとAPIで操作できる。

Firebaseとの最大の違いは2点ある。

• SQL（リレーショナルDB）: FirebaseはNoSQL（Firestore）だが、SupabaseはPostgreSQLそのもの。JOIN、トランザクション、外部キー制約が普通に使える。SQLを書ける人なら学習コストがほぼゼロ
• オープンソース: Supabaseのコードは全てGitHubで公開されている。ベンダーロックインを嫌う開発者がFirebaseから移行するケースが増えている。セルフホスト（Docker Compose）も可能

Y Combinator出身のスタートアップで、2024年にシリーズDで$200Mを調達。開発は活発で、2026年Q1にはAIコンピュートのオートスケーリング機能を追加した。

Supabaseの主要機能6つ

1. Database（PostgreSQL）

Supabaseのプロジェクトを作ると、専用のPostgreSQLインスタンスが立ち上がる。ダッシュボードのTable Editorでスプレッドシート感覚でテーブルを作れるが、SQLエディタも内蔵されているのでDDLを直接叩くこともできる。

2. Auth（認証）

メール/パスワード、マジックリンク、OAuth（Google、GitHub、Apple等）、電話番号認証に対応。Row Level Security（RLS）と組み合わせることで、「ログインユーザーは自分のデータだけ読み書きできる」というポリシーをSQL1行で定義できる。

3. Storage（ファイルストレージ）

画像やPDFなどのファイルをバケット単位で管理する。S3互換のAPIを持ち、CDN経由での配信に対応。画像のリサイズ・変換もサーバーサイドで処理できる。

4. Realtime（リアルタイム通信）

PostgreSQLの論理レプリケーションを利用して、テーブルの変更をWebSocketで即座にクライアントに通知する。チャットアプリやダッシュボードのリアルタイム更新に使える。

5. Edge Functions（サーバーレス関数）

TypeScriptで書いたサーバーレス関数をDenoランタイムのエッジで実行する。Stripeの決済Webhook処理や外部API連携など、フロントエンドに置けないロジックの置き場所になる。

6. Vector（ベクトル検索）

pgvector拡張を内蔵しており、OpenAIやHugging Faceで生成したエンベディングを格納して類似検索ができる。RAG（Retrieval-Augmented Generation）のバックエンドとして使う事例が2026年に入って急増した。

プロジェクト作成からテーブル操作まで

Step 1: アカウント作成

supabase.comにアクセスし、GitHubアカウントでサインアップする。無料プランではプロジェクトを2つまで作成可能だ。

Step 2: プロジェクトを作成

ダッシュボードから「New Project」をクリックし、以下を設定する。

• Name: プロジェクト名（任意）
• Database Password: PostgreSQLの接続パスワード（後から変更不可なので控えておく）
• Region: Northeast Asia（Tokyo）を選択

プロジェクトの起動には1〜2分かかる。完了するとダッシュボードに遷移する。

Step 3: テーブルを作成

Table Editorからテーブルを作る方法と、SQLエディタから直接DDLを実行する方法がある。筆者は後者の方が再現性が高いので好んで使っている。

-- タスク管理テーブルの例
CREATE TABLE tasks (
    id UUID DEFAULT gen_random_uuid() PRIMARY KEY,
    title TEXT NOT NULL,
    completed BOOLEAN DEFAULT false,
    user_id UUID REFERENCES auth.users(id),
    created_at TIMESTAMPTZ DEFAULT now()
);

-- RLS（行レベルセキュリティ）を有効化
ALTER TABLE tasks ENABLE ROW LEVEL SECURITY;

-- ログインユーザーは自分のタスクだけ操作可能
CREATE POLICY "Users can manage own tasks"
ON tasks FOR ALL
USING (auth.uid() = user_id);

RLSの設定を忘れるとAPIから全データが丸見えになる。ここは見落としがちだが、Supabaseで最も重要なセキュリティ設定だ。

Step 4: APIキーを取得

ダッシュボードの Settings > API から以下の2つを控える。

• Project URL: https://xxxx.supabase.co
• anon key: フロントエンドで使う公開キー（RLSで保護されたデータのみアクセス可能）

JavaScript/TypeScriptでCRUD操作を実装する

クライアントの初期化

npm install @supabase/supabase-js

import { createClient } from '@supabase/supabase-js'

const supabase = createClient(
    'https://xxxx.supabase.co',
    'your-anon-key'
)

データの操作

// CREATE: タスクを追加
const { data, error } = await supabase
    .from('tasks')
    .insert({ title: 'Supabaseを試す', user_id: userId })

// READ: 自分のタスク一覧を取得
const { data: tasks } = await supabase
    .from('tasks')
    .select('*')
    .order('created_at', { ascending: false })

// UPDATE: タスクを完了にする
await supabase
    .from('tasks')
    .update({ completed: true })
    .eq('id', taskId)

// DELETE: タスクを削除
await supabase
    .from('tasks')
    .delete()
    .eq('id', taskId)

SQLを書かずにメソッドチェーンでクエリを組み立てる。ORMに似ているが、裏ではPostgRESTというRESTful APIが動いている。型安全にしたい場合はsupabase gen typesコマンドでTypeScriptの型定義を自動生成できる。

リアルタイムサブスクリプション

// tasksテーブルの変更をリアルタイムで受信
const channel = supabase
    .channel('tasks-changes')
    .on('postgres_changes',
        { event: '*', schema: 'public', table: 'tasks' },
        (payload) => {
            console.log('変更検出:', payload)
        }
    )
    .subscribe()

チャットやダッシュボードのリアルタイム表示がこのコード量で実装できる。FirebaseのonSnapshot相当の機能だが、裏側はPostgreSQLの論理レプリケーションという点が異なる。

認証機能を30分で組み込む

// メール/パスワードでサインアップ
const { data, error } = await supabase.auth.signUp({
    email: '[email protected]',
    password: 'securepassword123'
})

// ログイン
const { data: session } = await supabase.auth.signInWithPassword({
    email: '[email protected]',
    password: 'securepassword123'
})

// Googleログイン
await supabase.auth.signInWithOAuth({
    provider: 'google'
})

// ログアウト
await supabase.auth.signOut()

// 現在のユーザーを取得
const { data: { user } } = await supabase.auth.getUser()

OAuthプロバイダ（Google、GitHub、Apple等）の設定はダッシュボードからClient IDとSecretを入力するだけで完了する。ゼロから認証を組んだ経験があれば、セッション管理・トークンリフレッシュ・プロバイダーごとの分岐処理がまるごと不要になる感覚は伝わると思う。

Firebaseとの比較 - どちらを選ぶべきか

Firebase（Firestore）からの移行を検討している人が増えている。料金体系の調査結果と、実際に両方を使った所感をまとめた。

もったいないと感じるのが、FirebaseのNoSQL制約だ。Firestoreでユーザーと注文の一覧を同時に引く場合、JOINが存在しないので複数リクエストを束ねるか、データを非正規化して保持するかの二択を迫られる。データの関係性が明確なアプリならSupabaseの方が設計が素直だ。

料金プラン - 無料枠の落とし穴と有料プランの選び方

2026年4月時点のプランは以下の4段階構成。Proプランからプロジェクト凍結がなくなる。

Proプランの超過料金はDB容量が$0.125/GB、ストレージが$0.021/GB、帯域が$0.09/GBと明示されている。Firebaseの「いつ跳ねるかわからない従量課金」に比べると、コスト予測が立てやすい。個人開発者の口コミを集めたところ、「Proプランで月$30-50に収まっている」という声が多かった。

AI/ベクトル検索 - pgvectorでRAGのバックエンドを構築

2026年に入ってSupabaseへの注目が高まった要因の一つが、pgvectorによるベクトル検索機能だ。Pineconeのような専用ベクトルDBを別途契約しなくても、PostgreSQL上でエンベディングの格納と類似検索が完結する。

-- ベクトル検索用のテーブル
CREATE TABLE documents (
    id UUID DEFAULT gen_random_uuid() PRIMARY KEY,
    content TEXT NOT NULL,
    embedding VECTOR(1536)  -- OpenAI text-embedding-3-smallの次元数
);

-- HNSWインデックスで高速化
CREATE INDEX ON documents
USING hnsw (embedding vector_cosine_ops);

// エンベディング生成 + Supabaseに格納（Edge Function内）
import { createClient } from '@supabase/supabase-js'

const supabase = createClient(SUPABASE_URL, SUPABASE_SERVICE_KEY)

// 類似検索（コサイン類似度）
const { data } = await supabase.rpc('match_documents', {
    query_embedding: embedding,  // 検索クエリのベクトル
    match_threshold: 0.78,
    match_count: 5
})

実際にHNSWインデックスを設定してクエリを実行すると、1万件のドキュメントに対する類似検索が50ms未満で返ってくる。チャットUIでユーザーが「重い」と感じる閾値は200ms前後とされているので、余裕がある。LangChainやLlamaIndexとの連携ライブラリも公式に提供されている。

よくある質問

まとめ

PostgreSQLが使えるなら、Supabaseのセットアップに迷う箇所はほぼない。DB・認証・ストレージ・ベクトル検索まで、ダッシュボードから触れる範囲でMVPが完成する。

FirebaseとのトレードオフはSQL対NoSQLの選好に帰結するので、データのリレーションが複雑なWebアプリならSupabaseが設計を楽にしてくれる。オフライン必須のモバイルアプリはFirebaseの領域だ。

supabase.comで無料プロジェクトを作り、上のSQLをSQLエディタに貼り付けるところから始めると、30分後にはAPIが動いている状態になる。