IDE Kamu

Apa ini

IDE (Integrated Development Environment) ialah app tempat kamu tulis, edit, dan run code.

Dalam Vibe Coding, IDE buat tiga kerja sekaligus: file editor, terminal, dan AI assistant.

Kenapa penting

IDE ialah workspace utama kamu untuk keseluruhan sesi. Kalau kamu tak selesa buka files, run terminal, dan baca cadangan AI dalam IDE, sesi akan rasa huru-hara.

Faham IDE sebelum sesi bermakna kamu habiskan masa membina, bukan troubleshoot tool.

Apa nak buat

Pilih IDE kamu

Kelas KD guna sama ada Antigravity atau Cursor. Kedua-duanya ialah AI coding editor yang dibina atas VS Code.

Ikut cadangan tutor untuk sesi tu. Jangan install kedua-duanya dan tukar tengah sesi.

Macam mana IDE nampak

IDE biasa ada empat kawasan:

Left sidebar    -> file explorer (files project kamu)
Main area       -> file yang kamu edit
Bottom panel    -> integrated terminal
Right panel     -> AI chat atau cadangan (khusus Antigravity/Cursor)

Belajar cari empat kawasan ni sebelum sesi mula.

Buka project folder

Selalu buka project folder, bukan satu file.

Dalam Antigravity atau Cursor:

1. Pergi ke File → Open Folder.
2. Pilih folder tempat project kamu ada.
3. Left sidebar patut tunjuk files project kamu sekarang.

Kalau sidebar tunjuk satu file je, kamu buka file bukannya folder. Tutup dan buka semula folder.

Guna integrated terminal

Terminal ialah tempat kamu run commands macam npm install dan npm run dev.

Buka dengan:

• Windows / Linux: Ctrl + `` `` ` (backtick)
• Mac: Cmd + `` `` ` (backtick)

Atau pergi ke Terminal → New Terminal dalam menu.

Terminal patut buka kat bawah IDE, sudah dalam project folder kamu. Semak path yang ditunjukkan — ia patut berakhir dengan nama project folder kamu.

Kalau ia dalam folder yang salah, guna cd untuk navigate:

cd path/to/your-project

Guna AI assistant

Antigravity dan Cursor ada panel AI chat built-in. Di sinilah kamu paste prompts semasa sesi.

Tabiat penting:

• Selalu baca response AI sebelum accept.
• Kalau AI cadangkan perubahan, faham apa ia buat sebelum apply.
• Guna AI untuk explain code, bukan sekadar generate.

Minta AI explain apa yang baru ia tulis:

Explain what this code does in simple terms.

Extensions

Untuk Antigravity atau Cursor, kamu biasanya tak perlukan extensions tambahan — features AI sudah built-in.

Kalau tutor minta kamu install extension, cari nama tepat yang mereka bagi. Jangan install extensions yang kamu tak kenal.

Checklist sebelum sesi

IDE sudah install dan buka tanpa error.
Project folder terbuka dalam IDE (bukan satu file sahaja).
Integrated terminal nampak dan dalam project folder.
node -v dan git --version kedua-duanya tunjuk nombor versi dalam terminal.
Panel AI chat boleh diakses.

Mistake biasa

• Buka satu file bukannya project folder.
• Guna system terminal (luar IDE) bukannya integrated terminal.
• Accept cadangan AI tanpa baca dulu.
• Install extensions tengah sesi yang rosakkan setup.
• Tutup panel terminal semasa dev server sedang jalan.