1. Pengenalan Supabase
Supabase adalah platform Backend-as-a-Service (BaaS) open source yang menyediakan semua tools yang dibutuhkan developer untuk membangun aplikasi tanpa perlu membangun backend dari nol. Didirikan pada tahun 2020 oleh Paul Copplestone dan Ant Wilson, Supabase sering disebut sebagai "open source Firebase alternative" karena menawarkan fitur serupa namun dengan fondasi database relational PostgreSQL.
Berbeda dengan Firebase yang menggunakan NoSQL (Firestore), Supabase membangun seluruh infrastrukturnya di atas PostgreSQL — database relational paling powerful dan mature di dunia. Ini berarti developer mendapatkan kekuatan full SQL, foreign keys, joins, dan fitur PostgreSQL lainnya yang tidak tersedia di platform NoSQL.
Apa Saja yang Disuplai Supabase?
| Layanan | Deskripsi | Teknologi Dasar |
|---|---|---|
| Database | PostgreSQL penuh dengan REST API otomatis | PostgreSQL + PostgREST |
| Auth | Sistem autentikasi lengkap (email, OAuth, phone) | GoTrue |
| Storage | Upload dan serve file (gambar, video, dokumen) | S3-compatible |
| Realtime | Subscribe perubahan data secara live | PostgreSQL WAL + WebSocket |
| Edge Functions | Serverless functions di edge (Deno runtime) | Deno + TypeScript |
| Vector | Embedding dan similarity search untuk AI | pgvector |
| RLS | Row Level Security untuk kontrol akses data | PostgreSQL RLS |
Supabase vs Firebase
| Aspek | Supabase | Firebase |
|---|---|---|
| Database | PostgreSQL (Relational / SQL) | Firestore (NoSQL / Document) |
| Open Source | ✅ Ya | ❌ Proprietary |
| Self-host | ✅ Bisa (Docker) | ❌ Tidak bisa |
| Query Language | SQL penuh + REST API | NoSQL query (terbatas) |
| Relasi Data | ✅ Foreign keys, joins | ⚠️ Manual denormalization |
| Realtime | ✅ Berdasarkan perubahan tabel | ✅ Berdasarkan dokumen/collection |
| Vendor Lock-in | 🟢 Rendah (standard SQL) | 🔴 Tinggi (proprietary) |
| Harga Gratis | 500 MB DB, 1 GB storage, 50K user | 1 GB storage, 50K reads/hari |
Memulai Proyek Supabase
Untuk mulai menggunakan Supabase, ikuti langkah berikut:
- Buka supabase.com dan daftar akun gratis
- Klik "New Project" dan isi nama project, password database, dan pilih region
- Tunggu sekitar 2 menit hingga project selesai di-provision
- Anda akan mendapatkan Project URL dan Anon Key di menu Settings → API
flowchart TD
Client["📱 Client\nGET /posts"] -->|"Request + JWT"| API["Supabase API"]
API -->|"Extract user_id\nfrom JWT"| RLS["🔒 RLS Policy\n("auth.uid(") = user_id)"]
RLS -->|"Filter rows"| DB["🗄️ PostgreSQL\nData Rows"]
DB -->|"Only matching rows"| API
API -->|"Filtered response"| Client
style Client fill:#2a0f1e,stroke:#f472b6
style API fill:#2a1f0a,stroke:#f59e0b,stroke-width:2px
style RLS fill:#2a0f0f,stroke:#ef4444,stroke-width:2px
style DB fill:#0f1d3a,stroke:#60a5fa,stroke-width:1.5px
Mengaktifkan RLS
-- AKTIFKAN RLS pada tabel (WAJIB untuk keamanan!)
ALTER TABLE profiles ENABLE ROW LEVEL SECURITY;
ALTER TABLE posts ENABLE ROW LEVEL SECURITY;
ALTER TABLE comments ENABLE ROW LEVEL SECURITY;
-- Kebijakan untuk tabel profiles:
-- Semua orang bisa membaca profile (public)
CREATE POLICY "Public profiles are viewable by everyone"
ON profiles FOR SELECT
USING (true);
-- User hanya bisa update profile miliknya sendiri
CREATE POLICY "Users can update own profile"
ON profiles FOR UPDATE
USING (auth.uid() = id)
WITH CHECK (auth.uid() = id);
-- User baru bisa insert profile sendiri
CREATE POLICY "Users can insert own profile"
ON profiles FOR INSERT
WITH CHECK (auth.uid() = id);
Policy untuk Posts & Comments
-- Posts: Siapa saja bisa baca post yang published
CREATE POLICY "Published posts viewable by everyone"
ON posts FOR SELECT
USING (published = true);
-- Posts: Author bisa baca draft miliknya
CREATE POLICY "Authors can view own unpublished posts"
ON posts FOR SELECT
USING (
auth.uid() = author_id
);
-- Posts: Authenticated user bisa buat post baru
CREATE POLICY "Authenticated users can create posts"
ON posts FOR INSERT
WITH CHECK (
auth.uid() = author_id
AND auth.role() = 'authenticated'
);
-- Posts: Author bisa edit post miliknya
CREATE POLICY "Authors can update own posts"
ON posts FOR UPDATE
USING (auth.uid() = author_id)
WITH CHECK (auth.uid() = author_id);
-- Posts: Author bisa hapus post miliknya
CREATE POLICY "Authors can delete own posts"
ON posts FOR DELETE
USING (auth.uid() = author_id);
-- Comments: Semua bisa baca komentar
CREATE POLICY "Comments viewable by everyone"
ON comments FOR SELECT
USING (true);
-- Comments: Authenticated user bisa komentar
CREATE POLICY "Authenticated users can create comments"
ON comments FOR INSERT
WITH CHECK (
auth.uid() = user_id
AND auth.role() = 'authenticated'
);
-- Comments: User bisa edit/hapus komentar sendiri
CREATE POLICY "Users can delete own comments"
ON comments FOR DELETE
USING (auth.uid() = user_id);
Menguji RLS
// Sebagai User A yang login
const { data: myPosts } = await supabase
.from('posts')
.select('*')
// Result: Hanya post yang published + post milik User A (termasuk draft)
// Sebagai User A — mencoba update post milik User B
const { error } = await supabase
.from('posts')
.update({ title: 'Diubah!' })
.eq('id', postMilikUserB)
// Result: Tidak ada error tapi 0 rows affected (RLS memblokir)
// Sebagai anon (tidak login)
const { data: publicPosts } = await supabase
.from('posts')
.select('*')
// Result: Hanya post yang published = true
- Selalu aktifkan RLS untuk setiap tabel yang diakses dari client
- Gunakan
auth.uid()untuk mendapatkan ID user yang sedang login - Gunakan
auth.role()untuk mengecek role (biasanyaauthenticatedatauanon) - Test policy dari berbagai sudut — sebagai owner, sebagai orang lain, dan sebagai anon
- Jangan lupa
FOR INSERTperluWITH CHECK(bukanUSING) - Pertimbangkan menggunakan Database Functions untuk policy yang kompleks
8. Quiz: Uji Pemahamanmu!
Setelah membaca tutorial di atas, jawablah 5 pertanyaan berikut untuk menguji pemahamanmu tentang Supabase: