Flow Session Vibe 101

Apa ini

Session flow ialah susunan langkah yang tutor dan pelajar ikut semasa Vibe Coding 101.

Flow dia:

Setup -> Git -> Node -> IDE -> First Project -> Plan -> Project Brief -> Design Spec -> Prompt Sheet -> Foundation -> Localhost -> Build -> Test -> GitHub -> Vercel -> Ship

Kenapa penting

Session boleh bergerak laju, tapi jangan jadi kelam-kabut.

Flow ini bantu pelajar tahu langkah seterusnya dan jaga rule utama: faham lebih penting daripada laju.

Apa nak buat

Guna map ini:

1. Setup: confirm device, internet, accounts, dan tools.
2. Git and GitHub: faham Git dan create GitHub account.
3. Node and npm: install Node dan faham macam mana ia run project.
4. Your IDE: buka project folder, terminal, dan AI assistant.
5. First Project: pilih satu idea website yang simple.
6. Macam Mana Nak Plan: brainstorm dalam notepad, guna ChatGPT untuk susun plan, simpan project-brief.md.
7. Project Brief: confirm brief yang disimpan lengkap sebelum teruskan.
8. Design Spec: guna ChatGPT untuk plan visual direction, simpan design-spec.md.
9. Prompt Sheet: guna prompt yang betul untuk setiap stage.
10. Project Foundation: create atau inspect starter files sahaja.
11. Localhost Checkpoint: run project secara local sebelum feature work.
12. First Visible Build: bina satu visible section.
13. Test, Debug, Improve: test, fix, buat satu small change, dan polish.
14. GitHub Checkpoint: simpan working code online.
15. Vercel Checkpoint: deploy project.
16. Ship: share link yang siap.

Mistake biasa

• Anggap map ini optional.
• Biar AI skip explanation.
• Bergerak terlalu laju bila pelajar keliru.
• Tukar session jadi kelas teori, bukan build session.