Pengenalan Vue — CompileDaily Study

Penjelasan

Vue adalah framework JavaScript progresif untuk membangun antarmuka pengguna — dikenal karena kurva belajarnya yang landai, dokumentasinya yang sangat jelas, dan Single File Component (file .vue yang menggabungkan template, script, dan style dalam satu file). Vue 3 (versi modern) memakai Composition API sebagai gaya penulisan yang direkomendasikan.

Instalasi & Cara Menjalankan

1. Pastikan Node.js sudah terinstal, cek dengan: node --version
2. Buat project baru lewat Vite: npm create vue@latest nama-project
3. Ikuti pertanyaan interaktifnya (TypeScript, Router, dst — pilih No dulu kalau baru belajar)
4. Masuk ke folder project: cd nama-project
5. Instal dependency: npm install
6. Jalankan server pengembangan: npm run dev
7. Buka http://localhost:5173 di browser — kalau muncul halaman default Vue, instalasi berhasil

Praktikum

Instal Vue lewat npm create vue@latest belajar-vue. Masuk ke foldernya, jalankan npm install lalu npm run dev, dan buka http://localhost:5173 di browser untuk memastikan halamannya muncul.

Editor Latihan

Ketik/edit bebas di sini untuk latihan — kode ini tidak dijalankan.

Tips

File .vue disebut Single File Component (SFC) — punya tiga bagian dalam satu file: <template> (HTML), <script setup> (logika JavaScript), dan <style> (CSS), semuanya scoped ke komponen itu saja kalau ditambah atribut scoped di tag style.