Dari Vibe Coding ke Agentic Engineering: Workflow Tiga Fase dengan Claude Code

Vibe coding sedang menjadi tren di kalangan developer yang menggunakan AI coding agent seperti Claude Code, Codex, atau Cursor. Namun, banyak yang menyadari bahwa membiarkan agent menebak-nebak requirement sering menghasilkan kode yang tidak konsisten, abstraksi berlebihan, atau malah merusak pattern yang sudah ada di codebase. Masalahnya bukan pada modelnya, melainkan pada proses di sekitar prompt.

Berdasarkan pengalaman tim APIMatic, solusinya adalah beralih dari vibe coding ke Agentic Engineering: sebuah workflow sistematis yang memperlakukan coding agent sebagai kolaborator yang literal namun mampu. Artikel ini membahas tiga fase workflow tersebut.

Vibe Coding vs Agentic Engineering

Vibe coding adalah praktik memberikan prompt singkat, melihat hasilnya, menerima jika terlihat benar, dan lanjut ke task berikutnya. Masalahnya muncul saat kode harus hidup di codebase nyata: agent mengisi setiap ambiguity dengan tebakan, dan developer mewarisi tebakan tersebut.

Agentic Engineering sebaliknya. Anda memperlakukan agent sebagai partner yang mampu namun literal, dan mempertahankan disiplin software engineering: requirement jelas, planning, testing, verification, dan code review. Agent mengetik lebih banyak; Anda tetap bertanggung jawab pada engineering-nya.

Fase 1: Structured Code Prompt

Setiap task dimulai dengan prompt terstruktur, bukan satu baris tugas. Template yang direkomendasikan terdiri dari tujuh komponen:

1. Task statement imperatif. Satu kalimat aktif, tanpa ambiguity. Contoh: Tambahkan offset-based pagination ke endpoint GET /users, bukan Mungkin bagus kalau user list bisa dihandle dengan lebih baik.

2. Intent di balik task. Jelaskan mengapa task ini penting. Misalnya: supaya endpoint tidak timeout pada dataset besar.

3. Pointer ke konteks relevan. Sebutkan file, modul, atau pattern spesifik yang harus dibaca agent sebelum mengubah apa pun.

4. Constraints. Batasan teknis, stylistik, atau operasional. Contoh: jangan ubah public API surface, ikuti pattern error-handling di auth.ts, tidak boleh menambah dependency baru.

5. Out-of-scope items. Tentukan apa yang tidak boleh disentuh. Ini mencegah agent melakukan perubahan well-intentioned tapi salah sasaran.

6. Testability expectations. Haruskah agent menulis unit test, update test existing, atau cukup memastikan suite masih pass?

7. Verifiable acceptance criteria. Setiap kriteria harus bisa dicek tanpa judgment manusia: passing test, response curl spesifik, atau lint tanpa error.

Contoh prompt lengkap:

Tambahkan offset-based pagination ke GET /users. Endpoint saat ini mengembalikan semua user dalam satu query, menyebabkan timeout production.

Sebelum mengubah apa pun, baca src/routes/users.ts, pattern pagination di src/routes/posts.ts, dan helper paginate() di src/db/helpers.ts.

Solusi harus default ke page=1, limit=20, gunakan pattern error-handling di src/lib/errors.ts, dan tidak boleh menambah dependency baru. Jangan sentuh endpoint lain, User model, atau database schema.

Tambahkan unit test di src/routes/users.test.ts dan pastikan suite existing pass. Task selesai ketika:
- GET /users mengembalikan meta object dengan page, limit, dan total
- GET /users dengan page=2 dan limit=10 mengembalikan slice yang benar
- Error handling tersedia untuk parameter page yang invalid

Fase 2: Plan Mode Sebelum Coding

Di Claude Code, aktifkan Plan Mode dengan menekan Shift + Tab dua kali atau menggunakan command /plan. Mode ini membuat agent hanya membaca dan merencanakan tanpa mengubah file apa pun.

Manfaat Plan Mode adalah memberikan waktu dan ruang (dalam token) bagi agent untuk memahami dan menghubungkan requirement sebelum implementasi. Anda bisa mereview file PLAN.md yang dihasilkan, memberikan feedback pada desain interface, menambahkan test coverage, atau mengoreksi asumsi agent.

Setelah plan disetujui, baru minta agent melanjutkan ke implementasi. Ini menghindari refactoring berulang karena requirement terlewat di awal.

Fase 3: Code Review dan Walkthrough

Setelah implementasi selesai, gunakan command /code-review bawaan Claude Code. Prompt yang efektif:

Use a subagent to review the changes against PLAN.md. Check that every requirement is implemented, the listed edge cases have tests, and nothing outside the task's scope changed. Report gaps, not style preferences.

Selain itu, minta agent melakukan code coverage check:

Check the test coverage for the new code and updated code files. Then close any gaps by adding new tests.

Terakhir, minta walkthrough untuk mempercepat review manual Anda:

Write a walkthrough tutorial to help me onboard onto the new code changes. Introduce new concepts, interfaces, and flows. Identify gotchas during implementation. Use code snippets and link to specific files.

Perbandingan dengan Workflow Manual

Sebelum adanya AI coding agent, workflow ideal untuk task non-trivial sudah mencakup: spike/research, design doc, implementasi, unit test, integration test, dan code review. Vibe coding sering membuang semua langkah ini kecuali implementasi. Agentic Engineering mengembalikan langkah-langkah tersebut dengan bantuan agent untuk mengeksekusi masing-masing fase lebih cepat.

Bedanya: di workflow manual, developer yang melakukan semuanya. Di Agentic Engineering, developer tetap mengambil keputusan arsitektur dan requirement, sementara agent membantu mengeksekusi penulisan kode, test, dan dokumentasi. Ini bukan pengganti engineer, melainkan amplifier.

Anti-Pattern yang Harus Dihindari

Saat beralih ke Agentic Engineering, ada beberapa jebakan umum yang perlu diwaspadai. Pertama, over-reliance pada plan file. PLAN.md adalah panduan, bukan kontrak absolute. Jika di tengah implementasi ditemukan edge case yang tidak ter-cover, jangan ragu untuk mengupdate plan daripada memaksakan agent mengikuti rencana yang sudah tidak relevan.

Kedua, skip review karena sudah capek. Workflow tiga fase memang lebih structured, tetapi tetap membutuhkan energi kognitif dari developer untuk review. Jika Anda merasa burnout setelah session panjang, simpan review untuk keesokan harian daripada merge kode dalam keadaan setengah sadar.

Kesimpulan

Tiga fase ini: Structured Prompt - Plan Mode - Review/Walkthrough mengubah coding session dari gambling menjadi engineering. Agentic Engineering bukan tentang membuat prompt lebih clever, melainkan membangun proses yang repeatable di sekitar prompt. Tim engineering terbaik mengintegrasikan coding agent ke dalam SDLC yang ada, bukan mengabaikannya.

Template prompt lengkap tersedia di GitHub Gist APIMatic. Untuk dokumentasi resmi Claude Code, kunjungi docs.anthropic.com.