Pempek Palembang Cek Lis
Storefront dan CMS custom untuk kedai pempek di Serpong, Tangerang Selatan. Pemiliknya mengelola menu, banner promo, ulasan, dan data kontak dari admin panel, tanpa perlu minta saya mengubah kodenya.
Masalahnya
Kedai ini belum punya website. Pelanggan menemukannya lewat Instagram dan harus menanyakan menu serta harga satu per satu via DM. Apa pun yang saya tulis langsung di kode berarti pemiliknya harus menghubungi saya setiap kali ada harga berubah, jadi situs statis bukan pilihan yang realistis.
Yang ingin saya bangun
Memberi kedai ini satu halaman yang bisa dikirim ke pelanggan dan selalu menampilkan harga terkini, serta memastikan setiap potong kontennya bisa diubah sendiri oleh pemiliknya tanpa menyentuh kode atau menunggu deploy.
Pendekatan
Situs Next.js App Router yang membaca konten dari Postgres di Supabase. Halamannya di-generate statis lalu direvalidasi, jadi sisi publik tetap cepat tapi tetap menangkap perubahan dari admin panel tanpa build ulang. Pesanan sengaja tidak lewat cart: setiap produk menautkan ke WhatsApp dengan pesan yang sudah terisi, karena begitulah kedai ini memang sudah menerima pesanan.
Gambaran umum
Storefront publik plus admin panel untuk kedai pempek. Saya mengerjakannya tanpa bayaran untuk kedai kenalan keluarga, dan itu jadi hal pertama yang saya tulis yang benar-benar diandalkan orang lain, bukan cuma saya. Sisi publiknya menampilkan menu beserta harga, banner promo, ulasan pelanggan, area pengiriman, dan jam buka, lalu mengirim pesanan ke WhatsApp dengan produknya sudah terisi di dalam pesan. Sisi admin mencakup menu, banner, ulasan, dan pengaturan situs seperti nomor WhatsApp dan tautan media sosial.
Arsitektur
Monorepo Turborepo dengan pnpm workspaces yang memuat situs publik dan admin panel. Postgres di Supabase untuk kontennya, dengan Row-Level Security supaya client anonim bisa membaca baris yang dipublikasikan tapi hanya admin terautentikasi yang bisa menulis. Supabase Auth untuk login admin, Supabase Storage dan Firebase untuk gambar produk dan banner. Dideploy di Vercel.
Yang berhasil dirilis
- Live di pempekceklis.biz.id dengan 6 item menu, 3 banner promo, 4 ulasan pelanggan, dan 5 area pengiriman, semuanya tersimpan di Postgres dan bisa diubah dari admin panel.
- Pemiliknya bisa mengubah harga, mengganti banner, atau memperbarui nomor WhatsApp tanpa perubahan kode dan tanpa deploy ulang.
- Pesanan membuka WhatsApp dengan produknya sudah tertulis di dalam pesan, jadi tidak ada form order atau cart yang perlu dirawat.
Bagian sulit & trade-off
- Menyusun policy Row-Level Security supaya situs publik bisa membaca katalog dengan anon key sementara akses tulis tetap terkunci ke sesi admin. Versi pertamanya membocorkan akses tulis lewat policy yang hanya memeriksa autentikasi, bukan role.
- Menentukan jeda revalidasi per jenis konten. Harga harus cepat berubah; teks profil tidak. Merevalidasi semuanya secara agresif justru menghilangkan gunanya static generation.
- Dua backend gambar (Supabase Storage dan Firebase) lebih banyak dari yang proyek ini butuhkan. Jalan sih, tapi kalau saya bangun ulang sekarang saya akan pilih satu saja.
Yang saya pelajari
- Row-Level Security layak dibayar dengan waktu setup, karena aturan aksesnya tinggal di sebelah datanya, bukan ditulis ulang di setiap query.
- Kliennya tidak menginginkan fitur, dia ingin berhenti menjawab DM yang sama terus-menerus. Membaca permintaannya seperti itu mengubah apa yang akhirnya saya bangun.
- Monorepo memudahkan berbagi tipe antara situs publik dan admin panel, tapi itu lebih banyak tooling daripada yang sebenarnya dibutuhkan proyek berisi dua aplikasi.
Rencana berikutnya
- 1Mengganti nomor WhatsApp placeholder dan sisa banner uji coba dengan data sebenarnya.
- 2Menyatukan penyimpanan gambar ke Supabase dan melepas ketergantungan pada Firebase.
- 3Menambahkan deskripsi menu versi Indonesia dan Inggris.