# Panduan Setup — Form Daftar/Login + Database User (Supabase)

**Kenapa Supabase?** Situs LokasiBisnis.id masih statis (Netlify/static hosting) — situs statis **tidak bisa** menyimpan database sendiri. Supabase menyediakan autentikasi + database PostgreSQL **gratis**, tanpa perlu server, cukup ditempel ke halaman HTML.

**Free tier (per data resmi [supabase.com/pricing](https://supabase.com/pricing), per 2026):**
- 50.000 pengguna aktif bulanan (MAU)
- 500 MB database PostgreSQL
- 1 GB file storage · 5 GB transfer
- Maks. 2 project aktif · project gratis di-pause setelah 1 minggu tidak aktif (buka dashboard untuk "membangunkan")
- (Angka bisa berubah — cek halaman resmi sebelum mulai.)

**File yang sudah disiapkan:**
- `supabase-config.js` — tempat menempel Project URL + anon key (SATU-SATUNYA yang perlu kamu ubah)
- `daftar.html` — form pendaftaran (nama, jenis pengguna, email, password)
- `login.html` — form masuk

---

## Langkah 1 — Buat project Supabase

1. Daftar di supabase.com (gratis, bisa login pakai GitHub).
2. **New project** → isi nama (cth: `lokasibisnis`) → pilih **region terdekat** (Singapura — terdekat dengan Indonesia) → buat password database (simpan baik-baik) → Create.
3. Tunggu project aktif (±2 menit).

## Langkah 2 — Buat tabel `profiles` (database user)

1. Buka menu **SQL Editor** di dashboard.
2. Tempel SQL di bawah, klik **Run**:

```sql
-- Tabel profil user
create table public.profiles (
  id uuid references auth.users on delete cascade primary key,
  full_name text,
  user_type text,          -- pemilik_bisnis | investor | agen_properti | konsultan
  created_at timestamptz default now()
);

-- Keamanan: tiap user hanya bisa akses profilnya sendiri (RLS)
alter table public.profiles enable row level security;

create policy "baca profil sendiri"  on public.profiles for select using (auth.uid() = id);
create policy "buat profil sendiri"  on public.profiles for insert with check (auth.uid() = id);
create policy "ubah profil sendiri"  on public.profiles for update using (auth.uid() = id);

-- Otomatis buat profil saat user daftar
create or replace function public.handle_new_user()
returns trigger language plpgsql security definer set search_path = public as $$
begin
  insert into public.profiles (id, full_name, user_type)
  values (new.id, new.raw_user_meta_data->>'full_name', new.raw_user_meta_data->>'user_type');
  return new;
end; $$;

create trigger on_auth_user_created
after insert on auth.users
for each row execute procedure public.handle_new_user();
```

3. Cek hasil: menu **Table Editor** → tabel `profiles` muncul.

## Langkah 3 — Tempel kunci ke `supabase-config.js`

1. Dashboard → **Settings → API**.
2. Salin **Project URL** (mis. `https://xxxx.supabase.co`) dan **anon public key** (eyJhbGciOi...).
3. Buka file `supabase-config.js` → ganti dua baris `PASTE_...` dengan nilai tadi.
4. **Penting:** pakai **anon key**, BUKAN `service_role key` (service role tidak boleh ada di kode website — bisa disalahgunakan).

## Langkah 4 — Cek konfigurasi email

1. Dashboard → **Authentication → Providers** → pastikan **Email** aktif (default aktif).
2. (Opsional) **Authentication → URL Configuration** → isi **Site URL** dengan alamat website kamu (mis. `https://lokasibisnis.id`) agar tautan konfirmasi email mengarah benar.
3. Default Supabase mewajibkan **konfirmasi email** — user baru harus klik tautan di email (cek folder Spam). Kalau mau nonaktifkan untuk demo cepat: Authentication → Providers → Email → matikan "Confirm email" (hanya untuk pengembangan, jangan untuk produksi).

## Langkah 5 — Tes

1. Buka `daftar.html` → isi form → Daftar.
2. Klik tautan konfirmasi di email → kembali ke `login.html` → masuk.
3. Cek dashboard Supabase: **Authentication → Users** (user terdaftar) dan **Table Editor → profiles** (profil otomatis terisi).

---

## Catatan penting

- **Data user adalah aset berharga** — RLS (row level security) di SQL di atas memastikan user hanya bisa melihat datanya sendiri.
- **Ganti `service_role` jangan pernah bocor** — kunci ini ada di Settings → API; simpan hanya di server (nanti).
- **Free tier di-pause setelah 1 minggu tidak aktif** — project "tidur" dan website login akan error sampai kamu buka dashboard Supabase.
- Kalau nanti butuh lebih (user > 50rb, storage > 1GB), baru naik ke paket berbayar.
- **Alternatif:** Firebase Auth (Google) juga punya free tier serupa — pilih Supabase jika ingin database SQL; pilih Firebase jika sudah nyaman ekosistem Google.

## Alur data yang terjadi

```
User isi daftar.html
   → Supabase Auth (daftar + konfirmasi email)
   → Trigger SQL otomatis membuat baris di tabel profiles
User login di login.html
   → Supabase Auth memvalidasi email+password
   → redirect ke index.html
```

**Langkah berikutnya yang bisa dibangun:** halaman profil (tampilkan nama/jenis user dari `profiles`), tombol "Keluar", atau "simpan listing favorit" per user (tabel baru `favorites`).
