Bawa Platform Donasi Amanah dari localhost ke URL publik dengan checklist yang bisa dibuktikan: build production, env Supabase, migration, deploy Vercel, health check, dan uji alur donasi di production.
40m bacaanKuis WajibMicro Badge Lesson
Launch Checklist & Deploy
Selama membangun Platform Donasi Amanah, kamu banyak menguji di lokal:
text
http://localhost:3000
Itu penting, tapi belum cukup. Localhost hanya membuktikan app berjalan di mesinmu, dengan environment milikmu, dan data yang mungkin kamu seed sendiri.
Production beda cerita. Di production, app harus bisa dibuka orang lain, memakai environment yang benar, membaca database yang benar, dan tetap menjaga data donatur. Kalau salah env, app bisa terlihat hidup tetapi membaca project Supabase yang salah. Kalau migration belum jalan, route bisa tampil tetapi insert donasi gagal. Kalau service key bocor ke bundle browser, deploy hijau justru berubah jadi insiden keamanan.
Jadi tujuan tahap ini bukan “upload ke Vercel”. Tujuannya: membuktikan Platform Donasi Amanah siap diakses publik dengan evidence yang bisa kamu tunjukkan.
Localhost bukan bukti launch
Ada beberapa gap yang sering muncul ketika app pindah dari lokal ke production:
Area
Di lokal
Di production
Environment
.env.local dibaca dari laptop
env harus dipasang eksplisit di Vercel
Database
bisa pakai local/staging
harus menunjuk Supabase production yang benar
Build
npm run dev toleran
npm run build lebih ketat
URL
hanya kamu yang akses
publik bisa akses route yang salah juga
Secret
mungkin aman di file lokal
bisa bocor kalau masuk client bundle
Ini alasan launch checklist harus berisi acceptance criteria, bukan daftar fitur.
“Homepage ada” bukan checklist yang cukup.
Yang lebih benar:
text
Homepage production menampilkan campaign published dari database production.
Kalimat itu bisa diuji. Ada URL, ada status campaign, ada database target, dan ada ekspektasi.
Tulis checklist sebelum deploy
Buat file:
text
docs/launch-checklist.md
Isi awalnya seperti ini:
md
# Launch Checklist — Platform Donasi AmanahStatus: NO-GO sampai semua item P0 terverifikasi.Production URL: [isi setelah deploy]Supabase project: [nama project, jangan tulis secret]Tanggal audit: [isi tanggal]## P0 — wajib sebelum GO### Scope publik- [ ] `/` menampilkan daftar campaign published dari database production.- [ ] `/campaigns/[slug]/donate` bisa dibuka untuk campaign published.- [ ] `/donation/confirmation/[donationNumber]?token=...` hanya tampil dengan token valid.- [ ] Tidak ada halaman eksperimen/setengah jadi yang tidak sengaja tampil publik.### Fungsi inti- [ ] Donasi valid bisa dibuat sampai menghasilkan nomor donasi.- [ ] Donasi invalid menampilkan error yang jelas.- [ ] Bukti transfer bisa diupload untuk donasi pending jika fitur upload sudah aktif.- [ ] Admin bisa approve/reject hanya setelah ada bukti.- [ ] Laporan transparansi hanya menghitung donasi verified.### Keamanan dan privasi- [ ] Service role key tidak ada di bundle browser.- [ ] Halaman konfirmasi tanpa token tidak membuka data.- [ ] Function publik/agregat tidak mengembalikan email, phone, token hash, atau idempotency key.- [ ] Bucket bukti transfer private.## P1 — boleh setelah GO terbatas- [ ] Copy homepage dipoles berdasarkan audit.- [ ] Empty state dan error state ditinjau ulang.- [ ] Dokumentasi SOP operasional dilengkapi.## KeputusanGO/NO-GO: [isi]Alasan: [isi]Bukti: [URL, command output, catatan browser]
Perhatikan status awalnya: NO-GO. Bukan karena app jelek, tapi karena belum dibuktikan.
Build production dulu
Sebelum deploy, jalankan:
bash
npm run build
Kalau build gagal, jangan deploy. Error build adalah data, bukan gangguan.
Contoh cara membaca hasil:
text
✓ Compiled successfully✓ Linting and checking validity of types✓ Collecting page data✓ Generating static pages
Kalau ada error seperti env hilang, route tidak valid, atau import salah, minta Antigravity memperbaiki dengan scope sempit:
text
Build production gagal.Error:[paste error lengkap]Tugas: perbaiki agar npm run build hijau.Batasan: jangan mengubah flow donasi/campaign. Jangan menambah fitur baru.Setelah selesai, laporkan file yang diubah dan kenapa error build hilang.
Jangan memberi prompt “fix all issues”. Itu undangan scope creep.
Tambahkan health check tanpa membocorkan secret
Health check berguna untuk memastikan deployment hidup. Buat route sederhana:
text
src/app/api/health/route.ts
Isi yang aman:
ts
import { NextResponse } from 'next/server';export function GET() { return NextResponse.json({ ok: true, env: process.env.VERCEL_ENV ?? 'development', });}
Health check bukan tempat debug secret. Ia hanya menjawab: app hidup di environment apa.
Prompt yang cukup:
text
Mulai dari AGENTS.md, DESIGN.md, dan docs/README.md.Tugas: tambahkan GET /api/health yang aman untuk production.Requirement:1. Return JSON { ok: true, env }.2. env memakai process.env.VERCEL_ENV ?? 'development'.3. Jangan mengembalikan secret, token, URL database private, atau service role key.4. Jangan mengubah flow campaign/donasi.Acceptance criteria:- npm run build hijau.- curl http://localhost:3000/api/health mengembalikan ok=true.- grep bundle production tidak menemukan service_role/SERVICE_ROLE.Laporkan file yang diubah dan cara verifikasi.
Deploy ke Vercel
Pastikan perubahan sudah masuk git:
bash
git statusgit add -Agit commit -m "chore: prepare production launch"
Deploy bisa lewat dashboard Vercel atau CLI. Kalau pakai CLI:
bash
npx vercel --prod
Saat konfigurasi env, pasang hanya yang memang diperlukan app client/server:
Kalau nanti ada server-only secret, namanya tidak boleh diawali NEXT_PUBLIC_. Jangan pernah menaruh service role key ke env publik.
Deploy app juga tidak otomatis menjalankan migration. Database production harus punya schema yang sama dengan yang app butuhkan. Catat ini di checklist:
text
Deploy app ≠ migrate database.
Verifikasi di URL production
Setelah URL keluar, jangan langsung GO. Uji dari URL production:
jika upload bukti sudah aktif, upload file valid dan file invalid;
jika admin verification sudah aktif, approve/reject dari akun admin.
Cek bundle:
bash
grep -RIn "SERVICE_ROLE\|service_role\|SUPABASE_SERVICE_ROLE" .next/static 2>/dev/null || echo "tidak ada service role di bundle static"
Kalau command menemukan secret literal, itu P0. Jangan publish.
Keputusan GO/NO-GO harus tertulis
Launch yang sehat punya keputusan eksplisit:
md
## KeputusanStatus: NO-GOAlasan:- confirmation tanpa token masih membuka data terbatas;- upload bukti memakai bucket public;- belum ada bukti npm run build di commit terakhir.Next action:- tutup confirmation tanpa token;- ubah bucket ke private;- ulang build dan verifikasi production.
Atau:
md
## KeputusanStatus: GO terbatasAlasan:- route P0 hidup;- donasi valid menghasilkan nomor;- confirmation butuh token;- service role tidak ada di bundle;- laporan transparansi menghitung verified saja.Catatan:- polishing copy homepage masuk P1.
GO terbatas lebih jujur daripada GO penuh jika masih ada pekerjaan non-kritis.
Checkpoint
docs/launch-checklist.md dibuat.
npm run build hijau sebelum deploy.
Env Vercel menunjuk Supabase production yang benar.
Migration production sudah disiapkan dan tidak tercampur dengan deploy app.
URL production diuji, bukan hanya localhost.
Service role key tidak bocor ke bundle static.
GO/NO-GO tertulis dengan bukti.
Kalau bagian ini terasa lebih “operasional” daripada ngoding, memang begitu. Banyak app gagal bukan karena fiturnya tidak dibuat, tapi karena tidak ada yang membuktikan production-nya siap. Di tahap berikutnya, kamu akan menambah lensa audit sebelum benar-benar percaya diri bilang: ini layak dilihat orang.
Checkpoint KuisTarget: 70%
Kuis 06.1 — Launch Checklist & Deploy
Kuis ini wajib untuk sertifikat. Kamu tetap bisa lanjut ke pelajaran berikutnya dan mengerjakannya nanti.