Mulai dengan benar

Siapkan keputusan awal, akun layanan, dan urutan kerja sebelum kamu menjalankan KilatKoding.

​

Sebelum menjalankan project

Jangan mulai dari npm run dev dulu. Putuskan dulu fitur apa yang benar-benar ingin kamu pakai. KilatKoding memang lengkap, tetapi tidak semua produk butuh semua modul.

​

Pilih jalur yang sesuai

​

Kalau kamu non-teknis

Gunakan dokumentasi ini untuk:

• memahami halaman dan fitur yang sudah tersedia,
• menyiapkan akun layanan yang dibutuhkan,
• memberi arahan yang jelas ke developer atau AI coding assistant.

​

Kalau kamu developer

Gunakan dokumentasi ini untuk:

• memilih fitur yang aktif,
• mengisi .env.local,
• menjalankan migrasi Supabase,
• menyesuaikan branding dan pricing,
• memverifikasi build, test, dan deployment.

​

Checklist keputusan awal

Keputusan	Pilihan	Dampak
Auth	Aktif atau nonaktif	Mengontrol login, signup, dashboard, settings, admin
Payments	Midtrans, Doku, atau nonaktif	Mengontrol billing, checkout, dan webhook
Contact form	Aktif atau nonaktif	Menentukan apakah kamu butuh Resend untuk form kontak
Waitlist	Aktif atau nonaktif	Menentukan apakah halaman waitlist akan dipakai
AI	Aktif atau nonaktif	Menentukan apakah kamu perlu API key OpenAI atau Anthropic
Admin	Aktif atau nonaktif	Menentukan apakah panel admin dan role management akan dipakai

​

Akun layanan yang mungkin kamu butuhkan

Layanan	Wajib?	Dipakai untuk
Supabase	Ya, jika auth atau data app aktif	Auth, database, profile, subscriptions, payments, waitlist, audit, rate limits
Resend	Opsional	Contact form, welcome email, invoice
Midtrans	Opsional	Checkout dengan Snap
Doku	Opsional	Checkout dengan JOKUL
OpenAI atau Anthropic	Opsional	Fitur AI

​

Playbook setup cepat

Kalau kamu tidak ingin membaca semua halaman dari nol, pakai jalur cepat ini lalu lanjutkan ke halaman detail yang relevan.

Tujuan	Toggle awal yang umum	Layanan minimum	Baca sesudah ini
Validasi ide dengan waitlist dulu	Auth off, Waitlist on, Contact opsional, Payments off, Admin off, AI off	Supabase, opsional Resend	Use case KilatKoding, Setup layanan, Kustomisasi
SaaS berlangganan tanpa AI	Auth on, Payments on, Admin on, Contact opsional, AI off	Supabase + Midtrans atau Doku	Setup layanan, Environment variables, Testing dan deployment
SaaS dengan fitur AI	Auth on, Payments opsional, Admin on, AI on	Supabase + OpenAI atau Anthropic, plus payment provider kalau monetisasi berlangganan	AI dan tooling, Setup layanan, Environment variables
Portal member atau client	Auth on, Payments opsional, Admin opsional, Contact opsional, AI off	Supabase	Kustomisasi, Komponen dan UI, Arsitektur

on dan off di atas mengacu ke toggle NEXT_PUBLIC_ENABLE_* yang dijelaskan lebih rinci di Environment variables.

Kalau kamu ingin titik mulai yang bisa langsung di-copy ke .env.local, buka juga Resep preset per use case.

​

Prompt AI yang bisa langsung kamu pakai

Saya ingin menyiapkan KilatKoding untuk produk berikut:

[jelaskan use case, fitur aktif yang diinginkan, payment provider, AI provider, dan siapa yang akan setup]

Tolong bantu saya membuat rencana setup yang rapi:
1. Keputusan awal yang harus saya ambil dulu
2. Service account yang perlu disiapkan
3. Urutan setup paling aman
4. Halaman docs yang harus saya baca setelah ini
5. Checklist verifikasi setelah setup lokal selesai

Pisahkan mana langkah untuk non-tech user dan mana yang butuh developer.

​

Urutan kerja yang paling aman

1. Tentukan fitur yang aktif

   Putuskan modul apa saja yang dipakai. Nanti kamu akan mengatur ini lewat NEXT_PUBLIC_ENABLE_* di .env.local.

2. Siapkan akun layanan

   Buat project Supabase. Tambahkan Resend, Midtrans, Doku, atau AI provider hanya jika memang dipakai.

3. Jalankan setup lokal

   Ikuti Setup lokal sesuai sistem operasi kamu.

4. Isi environment variables

   Gunakan Environment variables sebagai referensi utama saat mengisi .env.local.

5. Verifikasi readiness

   Jalankan npm run env:check, lalu cek GET /api/health setelah app hidup.

​

Hasil yang sebaiknya kamu targetkan

Sebelum kamu mulai kustomisasi besar, pastikan dulu hal-hal ini berjalan:

• landing page bisa dibuka,
• auth flow berjalan atau sengaja dimatikan,
• dashboard bisa dibuka untuk user login,
• payment flow aktif kalau kamu memang menyalakannya,
• npm run lint, npm run typecheck, dan npm test tidak gagal.

Kalau kamu ingin mengaktifkan hanya sebagian fitur, itu normal. KilatKoding memang didesain agar beberapa area bisa dimatikan lewat toggle dan menampilkan fallback yang jelas.