Seperti pada artikel saya sebelumnya mengenai daftar framework javascript yang populer saat ini dan mengenal Vue.js. Pada artikel ini saya akan menulis bagaimana cara instalasi Vue.js di Linux. Saat ini saya menggunakan Linux Ubuntu 18.04 LTS, sepertinya masih belum bisa beranjak ke versi 20.04 LTS hehehe…
Vue.js adalah framework javascript yang memungkinkan Anda untuk mengembangkan “single page application”, yaitu aplikasi yang dibuat dengan javascript responsif, secara singkat dan sederhana, aplikasi yang dapat berjalan tanpa memuat ulang halaman di setiap interaksi (terutama dengan panggilan AJAX) yang memungkinkan pengguna untuk memiliki pengalaman yang sangat menyenangkan, cepat dan sangat modern.
Sebenarnya ada 3 cara untuk memulai atau menginstal Vue.js, yaitu :
- Menggunakan CDN, hanya dengan memanggil script Vue.js dari link CDN. saya tidak akan membahas ini.
- Menggunakan NPM
- Menggunakan Vue CLI
Mengunakan NPM
NPM (Node Package Manager) digunakan untuk menginstal paket. Anda dapat menggunakannya untuk menginstal Vue dalam proyek baru atau yang sudah ada. Anda perlu memastikan Anda telah menginstal Node.js bersama dengan akses ke NPM. Jika sebelumnya Anda belum pernah menginstal NPM dan Node.js, ikuti perintah di bawah:
Install Node.js
sudo apt update sudo apt install nodejs
Install NPM
sudo apt install npm
Untuk mengecek versi dari NPM dan Node.js, bisa gunakan perintah di bawah :
npm --version
nodejs --version
Ketika proses instalasi NPM dan Node.js sudah benar, buka kembali terminal dan buat folder untuk memulai project baru Vue.js
mkdir vue-npm && cd vue-npm
Kemudian untuk menyimpan dependensi dari aplikasi yang akan kita bangun berdasarkan apa yang akan diinstal dengan NPM, kita perlu membuat file package.json.
npm init -y
Kemudian kita menginstal Vue.js, dengan perintah
npm install vue --save
Karena secara default pada package.json, file utama dari aplikasi adalah index.js. Dan Anda mesti menambahkan package lainnya lagi untuk mulai membangun aplikasi.
Menggunakan Vue CLI
Untuk menggunakan Vue CLI, kita juga harus menginstal Node.js dan NPM sebelumnya. Caranya sama seperti di atas. Gunakan perintah di bawah untuk menginstall Vue CLI:
npm install -g @vue/cli
Vue menyediakan CLI untuk single page application yang cepat. Vue CLI menyediakan pengaturan pembangunan aplikasi untuk alur kerja frontend modern. Hanya perlu beberapa menit untuk memulai dan menjalankan aplikasi dengan hot-reload, lint-on-save, dan versi produksi.
Dengan menggunakan Vue CLI, kita coba untuk membuat project dengan perintah di bawah:
vue init webpack-simple vue-cli
Webpack adalah kumpulan bundel modul dari aset aplikasi Anda (seperti komponen Vue dan file Javascript biasa) dan menggabungkannya ke dalam bundel yang disebut. Hal ini berbeda dari hanya menyatukan dan memperkecil file Javascript. Kemudian buka folder vue-cli.
cd vue-cli
Kemudian install
npm install
Jalankan aplikasi ini dengan perintah
npm run dev
Maka akan otomatis membuka web browser dengan tampilan default.
Cukup mudah bukan?
