SupabaseはオープンソースのFirebase代替として注目されているBaaS（Backend as a Service）です。PostgreSQLベースのデータベース、認証、ストレージ、リアルタイムサブスクリプションを無料から使えます。

Supabaseの特徴

機能	内容
データベース	PostgreSQL（フルアクセス可能）
認証	メール・ソーシャル認証（Google/GitHub等）
ストレージ	画像・ファイルの保存
Edge Functions	Deno/TypeScriptでサーバーレス関数
Realtime	リアルタイムデータ同期
Row Level Security	行レベルのアクセス制御

無料プランの制限

リソース	無料枠
データベース	500MB
ストレージ	1GB
帯域	5GB/月
認証ユーザー	50,000人/月
Edge Functions	500,000回/月

個人開発やMVP（最小限のプロダクト）の段階では無料枠で十分なケースが多いです。

セットアップ

1. プロジェクト作成

supabase.com でアカウント作成後、新しいプロジェクトを作成します。PostgreSQLのパスワードを設定してください（重要: 後で変更できません）。

2. クライアントライブラリのインストール

npm install @supabase/supabase-js

3. 初期化

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

const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL!;
const supabaseKey = process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!;

export const supabase = createClient(supabaseUrl, supabaseKey);

環境変数は Supabase ダッシュボードの「Settings → API」から取得できます。

データベース操作

テーブル作成（Supabase ダッシュボードまたはSQL）

CREATE TABLE posts (
  id UUID DEFAULT gen_random_uuid() PRIMARY KEY,
  title TEXT NOT NULL,
  content TEXT,
  user_id UUID REFERENCES auth.users(id),
  created_at TIMESTAMPTZ DEFAULT NOW()
);

CRUD操作

// SELECT（全件取得）
const { data, error } = await supabase
  .from('posts')
  .select('*')
  .order('created_at', { ascending: false });

// SELECT（条件付き）
const { data } = await supabase.from('posts').select('id, title').eq('user_id', userId).limit(10);

// INSERT
const { data, error } = await supabase
  .from('posts')
  .insert({ title: 'Hello World', content: 'My first post' })
  .select()
  .single();

// UPDATE
await supabase.from('posts').update({ title: 'Updated Title' }).eq('id', postId);

// DELETE
await supabase.from('posts').delete().eq('id', postId);

認証

メールアドレス認証

// サインアップ
const { data, error } = await supabase.auth.signUp({
  email: 'user@example.com',
  password: 'securepassword',
});

// ログイン
const { data, error } = await supabase.auth.signInWithPassword({
  email: 'user@example.com',
  password: 'securepassword',
});

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

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

ソーシャル認証（GitHub等）

await supabase.auth.signInWithOAuth({
  provider: 'github',
  options: {
    redirectTo: 'https://yourapp.com/auth/callback',
  },
});

Row Level Security（RLS）

SupabaseのRLSはPostgreSQLの行レベルセキュリティ機能を活用した重要な機能です。

-- postsテーブルのRLSを有効化
ALTER TABLE posts ENABLE ROW LEVEL SECURITY;

-- 自分の投稿だけ読み取れるポリシー
CREATE POLICY "Users can read own posts"
  ON posts FOR SELECT
  USING (auth.uid() = user_id);

-- 認証済みユーザーのみ投稿できる
CREATE POLICY "Authenticated users can insert"
  ON posts FOR INSERT
  WITH CHECK (auth.uid() = user_id);

重要: RLSを設定しないと、anon keyを知っている誰でもテーブルにアクセスできます。必ずRLSを有効化してください。

Next.jsとの連携（App Router）

// lib/supabase/server.ts
import { createServerClient } from '@supabase/ssr';
import { cookies } from 'next/headers';

export async function createClient() {
  const cookieStore = cookies();
  return createServerClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL!,
    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
    {
      cookies: {
        get(name) {
          return cookieStore.get(name)?.value;
        },
        set(name, value, options) {
          cookieStore.set({ name, value, ...options });
        },
        remove(name, options) {
          cookieStore.set({ name, value: '', ...options });
        },
      },
    },
  );
}

Firebase vs Supabase

項目	Supabase	Firebase
データベース	PostgreSQL（SQL）	Firestore（NoSQL）
オープンソース	✓（セルフホスト可）	✗
SQL対応	✓	✗
料金	無料枠が大きい	従量課金（高くなりやすい）
学習コスト	SQL知識が必要	低い
リアルタイム	✓	✓

SQLに慣れているエンジニアならSupabaseが使いやすいです。

まとめ

• 無料枠でPostgreSQL・認証・ストレージが使える
• TypeScriptの型定義が生成でき（supabase gen types）、型安全に開発できる
• RLSを必ず設定してセキュリティを確保する
• Next.js/Astro/SvelteKitとの連携ライブラリが整備されている

個人開発でバックエンドを1から作りたくない場合、Supabaseは最良の選択肢のひとつです。PostgreSQLの柔軟性と認証・ストレージの手間を省けるバランスが評価されています。

関連記事

• Docker入門 — エンジニアが最初に知るべきコンテナの基本と実践 — 詳細はこちら
• AI時代の副業ロードマップ：Claudeを相棒にして特化ブログを100記事量産するコツ【2026年版】 — 詳細はこちら
• Agentic RAG実装ガイド2026: PythonとDockerで構築する自律型AI — 詳細はこちら