Akademiacademy / vibe-101 / v0-overview

Overview V0 First Website

V0 Build Station - Setup Website Pertama. Kamu pass bila ChatGPT ready untuk hasilkan lima prompt V0, V0 sudah dibuka untuk build, dan saved planning files kamu sudah ready.

Reference

Masa: 10 min
Sesuai untuk: total beginner yang bina website pertama dalam browser
Kamu hasilkan: setup tab V0 + checklist source file
Checkpoint: ChatGPT ready, V0 ready, dan brief/blueprint saya ready

Apa ini

V0 First Website ialah path build dalam browser yang menjadi default untuk total beginner dalam Vibe 101. Ia bantu kamu bina website pertama tanpa install Node, Git, IDE, atau guna terminal.

V0 boleh hasilkan real code dan live prototype daripada prompt biasa. Dalam Vibe 101, kamu tidak mula dengan taip idea mentah ke V0. Kamu guna ChatGPT atau planning AI lain untuk tukar saved planning files kepada lima prompt V0 yang fokus.

Ia tidak menggantikan KD Flow Lite. Kamu masih plan dulu, bina dengan teliti, inspect hasil, fix satu isu, dan explain apa yang berubah.

Kenapa penting

Setup local tidak patut menentukan sama ada beginner dapat website pertama atau tidak. V0 bantu kamu terus bergerak ikut method dalam browser, sementara Developer Upgrade masih ada kemudian bila kamu ready untuk code ownership local.

Credit V0 boleh jadi terhad. Setiap generation perlu ada tugas yang jelas. Flow paling selamat ialah: sediakan prompts dalam ChatGPT dahulu, paste ke V0 satu demi satu, dan inspect preview sebelum sambung.

Apa nak buat

Step 1: Faham V0 digunakan untuk apa hari ini

Area V0	Guna hari ini	Elak hari ini
Prompt-to-site	Draft website pertama daripada brief + blueprint	Idea mentah tanpa plan
Preview	Inspect sebelum prompt lagi	Percaya output secara membuta tuli
Visual inputs	Sketch/screenshot/layout reference yang selamat	Data private/client/sensitif
Versions	Recover kalau fix jadi lebih teruk	Panic dan generate semula dari kosong
Share/Publish	Proof bila available	Anggap live URL sahaja sebagai kejayaan
Code tab	Faham generated files secara ringan	Code editing mendalam dalam Vibe 101

Step 2: Buka dua tab

Pastikan dua tab ini terbuka sebelum mula build pack:

Tab	Guna untuk
ChatGPT atau planning AI lain	Paste saved files kamu dan hasilkan lima prompt V0
V0	Paste setiap prompt yang dijana ke V0 chat/composer, satu demi satu

Dalam V0, sign in dan buka new project atau chat supaya ia ready untuk Prompt 1.

Step 3: Kumpulkan saved files kamu

Wajib:

project-brief.md — source of truth untuk idea, audience, scope, dan non-goals.
build-blueprint.md — source of truth untuk page structure, sections, components, dan first build task.

Optional:

design-spec.md — guna hanya jika tutor minta atau kamu sudah hasilkan. Jika tiada, guna Visual Direction dalam build-blueprint.md.

Jangan paste raw planning files terus ke V0 dahulu. Page seterusnya tunjuk cara paste files ini ke ChatGPT supaya ia boleh hasilkan lima prompt yang ready untuk V0.

Step 4: Check bukti finish kamu

Di akhir path ini, kamu perlukan salah satu bukti ini:

Bukti finish	Dikira bila
V0 preview link	Page berfungsi dan kamu boleh explain
Published V0 atau Vercel URL	Account dan publish flow tersedia
Screenshot atau screen recording	Publishing block tapi website sudah wujud
Explanation 60 saat	Kamu boleh cakap apa yang dibina, AI bantu apa, dan apa yang kamu fix

Mistake biasa

Buka V0 dengan idea mentah sahaja.
Paste semua planning files terus ke V0 sebelum hasilkan five prompt pack.
Paste semua lima prompt ke V0 sekali gus.
Minta login, database, payment, atau dashboard terlalu awal.
Anggap publish ialah satu-satunya finish yang sah.

Next step

Pergi ke 5-Prompt Pack untuk tukar saved files kamu kepada lima prompt V0.