Workflow Vibe Coding

Analogi: Resep Masak yang Bisa Diulang

Di modul sebelumnya kamu vibe coding seperti memasak impulsif: lihat bahan, cicipi, tambah bumbu sesukanya. Hasilnya enak, tapi kamu tidak bisa mengulanginya persis dan kalau gagal kamu tidak tahu di langkah mana salahnya. Workflow adalah resepnya: urutan langkah tertulis yang bisa kamu ikuti (dan ulangi) setiap kali bangun sesuatu dengan AI. Dengan workflow yang bagus, hasilmu konsisten, bukan untung-untungan.

Kenapa Workflow Menentukan Hasil

Dua orang dengan AI yang sama bisa dapat hasil yang beda jauh. Pembeda terbesarnya bukan kepintaran, tapi proses. Tanpa workflow, sesi vibe coding biasanya berakhir begini: prompt acak, kode menumpuk tanpa struktur, satu bug merembet ke mana-mana, lalu frustrasi dan mulai dari nol. Dengan workflow, setiap sesi punya arah: kamu tahu sedang di langkah berapa, apa yang sudah diverifikasi, dan versi mana yang aman untuk kembali.

Contoh 1: Workflow 6 Langkah untuk Proyek Kecil

Ini workflow standar yang bisa kamu pakai untuk hampir semua proyek kecil (landing page, todo app, kalkulator, galeri):

Langkah 1: Definisikan "selesai". Tulis 3-5 kalimat: aplikasi ini ngapain, siapa yang pakai, dan kapan kamu anggap selesai. Contoh: "Aplikasi catatan sederhana. User bisa tambah, hapus, dan cari catatan. Selesai kalau semua itu jalan di HP dan data tidak hilang saat refresh." Tanpa definisi selesai, kamu akan menambah fitur terus tanpa akhir.

Langkah 2: Minta rencana, bukan kode. Prompt: "Berdasarkan definisi di atas, buatkan rencana: file apa saja yang dibutuhkan, dan urutan pengerjaannya. Jangan tulis kode dulu." Review rencananya. Kalau ada yang aneh, koreksi sekarang, jauh lebih murah daripada koreksi kode.

Langkah 3: Bangun per langkah, verifikasi tiap langkah. "Kerjakan langkah 1 saja." Buka hasilnya di browser. Coba. Kalau oke, lanjut. Kalau tidak, perbaiki dulu. Jangan pernah menumpuk 5 langkah tanpa verifikasi.

Langkah 4: Simpan checkpoint. Setiap 2-3 langkah yang berhasil, simpan salinan (atau commit Git: git commit -m "fitur tambah catatan selesai"). Ini tombol "undo" daruratmu.

Langkah 5: Minta AI me-review kodenya sendiri. "Review kode yang kamu buat: ada bug potensial? Ada yang bisa disederhanakan?" AI sering menemukan masalahnya sendiri saat diminta jadi reviewer.

Langkah 6: Uji seperti user. Tutup editor, buka aplikasinya, pakai seperti orang awam. Klik yang tidak-tidak. Refresh. Perkecil layar HP. Catat yang aneh, perbaiki satu per satu.

Contoh 2: Workflow dengan Peran yang Jelas (Bertahap)

Untuk hasil lebih konsisten, bagi peran secara eksplisit di awal sesi:

Untuk sesi ini, peranmu:

1. Perencana: sebelum menulis kode apa pun, selalu ajukan rencana dan tunggu persetujuanku.
2. Pembangun: tulis kode satu langkah kecil dalam satu waktu.
3. Penguji: setelah menulis kode, jelaskan cara aku mengujinya (langkah klik apa, hasil apa yang diharapkan).
4. Pencatat: di akhir tiap langkah, ringkas apa yang berubah dalam 2 kalimat.

Jangan pernah menggabungkan peran tanpa izinku. Kita mulai dari proyek: [deskripsi proyekmu].

Pola ini menyelesaikan masalah klasik: AI yang terlalu "rajin" (langsung menulis 300 baris kode tanpa rencana) atau terlalu "pasif" (bertanya terus tanpa aksi). Dengan peran yang jelas, ritmenya jadi: rencana > setuju > bangun kecil > uji > catat > ulangi. Kamu selalu memegang kendali, AI selalu tahu apa yang diharapkan darinya.

Kesalahan Umum Pemula

1. Melewati langkah definisi. Langsung "buatkan X" tanpa mendefinisikan selesai itu seperti berangkat tanpa tujuan. Kamu akan iterasi tanpa akhir karena tidak tahu kapan berhenti.
2. Verifikasi borongan di akhir. Membangun 10 fitur lalu menguji semuanya sekaligus = 10 bug yang saling terkait dan tidak jelas sumbernya. Verifikasi kecil-kecil jauh lebih murah.
3. Tidak ada checkpoint. "Tadi sudah bagus, tapi aku minta ubah sedikit dan jadi rusak semua." Tanpa checkpoint, tidak ada jalan kembali. Git (track Git & GitHub) adalah solusi permanennya; copy file adalah solusi daruratnya.
4. Workflow kaku untuk semua situasi. Workflow 6 langkah cocok untuk proyek kecil. Untuk eksplorasi ide ("coba-coba dulu bagus tidak"), boleh lebih longgar: definisi ringan, iterasi cepat, tanpa checkpoint formal. Sesuaikan kedisiplinan dengan taruhannya.

Catatan teknis: Workflow yang baik pada dasarnya adalah context engineering yang dilembagakan: tiap langkah memberi AI konteks yang segar dan relevan (rencana yang disetujui, hasil verifikasi langkah sebelumnya, ringkasan perubahan). Inilah kenapa AI agent modern (modul ai-agent-pengenalan) bekerja dalam loop: rencana > aksi > observasi > rencana lagi. Workflow manual yang kamu pelajari di sini adalah versi manusia dari loop yang sama, dan akan terasa familiar saat kamu memakai agent nanti.

Rangkuman

Workflow mengubah vibe coding dari untung-untungan jadi proses yang bisa diulang: definisikan selesai > minta rencana > bangun kecil + verifikasi > checkpoint > review > uji seperti user. Tambahkan peran eksplisit (perencana, pembangun, penguji, pencatat) untuk ritme yang konsisten. Mulai pakai workflow ini di proyek kecilmu berikutnya, dan rasakan bedanya: lebih sedikit frustrasi, lebih banyak yang selesai.