Cara Mudah Instalasi dan Menjalankan Vue Admin Template

Halo semuanya, kembali lagi di sahretech. Kali ini saya akan berbagi tutorial kepada kalian semua cara melakukan instalasi template vue js dan cara menggunakannya. Untuk itu ayo ikuti turorialnya berikut ini!.

Ada banyak sekali template bootstrap yang dapat kita gunakan untuk mempercantik dan mempermudah pengembagan sebuah website. Dengan hadirnya template-template yang ada di internet, para developer tidak perlu pusing lagi memikirkan tampilan yang cantik dan responsive, karena semua itu sudah disediakan oleh template yang kita download. Kali ini kita akan menggunakan template gratis yang dibuat oleh https://www.creative-tim.com yaitu vue argon dashboard.

Oh iya, saya juga sudah mengulas cara menggunakan template bootstrap di php native, klik link berikut ini untuk melihat tutorialnya https://www.sahretech.com/2019/10/cara-pasang-template-bootstrap-di.html

Saya juga telah membuat artikel lainnya, yaitu cara menggunakan template bootstrap di laravel. Klik link berikut ini untuk melihat tutorialnya https://www.sahretech.com/2020/08/cara-mudah-memasang-template-bootstrap.html

Lalu saya juga membuat artiktel tentang template-template pilihan. Kalian bisa klik artikel nya pada link berikut ini. https://www.sahretech.com/2020/10/template-boostrap-admin-gratis-pilihan.html

Cara Install dan Menggunakan Vue Admin Template

1. Install Node.js

Pertama, kalian perlu menginstall node.js terlebih dahulu. Download node.js pada link berikut ini https://nodejs.org/en/download/. Setelah terdownload, install node.js seperti aplikasi pada umumnya dan tunggu instalasi hingga selesai.

Setelah instalasi selesai, jalankan perintah di bawah ini menggunakan cmd atau terminal untuk mengecek apakah node.js telah berhasil diinstall di komputer kalian. Perintah berikut ini  berfungi untuk mengecek versi node.js yang terinstall

node -v

Sebenarnya hal yang paling kita butuhkan dari node.js adalah NPM. NPM akan otomatis terinstall saat kita melakukan instalasi node.js. NPM memiliki fungsi yang sama dengan composer, NPM adalah singkatan dari node package manager, yang berfungsi untuk mendownload modul atau library beserta depedency tambahan dari internet. Untuk mengecek versi npm yang digunakan kalian bisa menjalankan perintah di bawah ini pada cmd atau terminal.

npm -v

2. Download Template

Setelah tahap pertama selesai dilakukan, selanjutnya download vue argon dashboard pada link berikut ini https://www.creative-tim.com/product/vue-argon-dashboard dan letakkan pada folder yang telah kalian tentukan sebelumnya. Sedikit informasi: vue argond dashboard adalah template yang dibuat oleh https://www.creative-tim.com disana juga terdapat template-template keren lainnya. Dan template ini juga sudah menggunakan bootstrap 4.

Template Vue Js

3. Jalankan Template Vue

Setelah terdownload dan tersimpan pada folder yang telah kalian tentukan. Pertama masuk terlebih dahulu ke dalam folder template vue argon dashboard dengan menggunakan cmd atau terminal. Pada tutorial kali ini saya meletakkan folder template vue pada folder documents/latihan.

Letak folder template

Setelah masuk ke dalam folder template, selanjutnya jalankan perintah di bawah ini dengan cmd atau terminal untuk mendownload depedency yang diperlukan.

npm install

Setelah proses download depedency selesai, selanjuntya jalankan perintah di bawah ini dengan cmd atau terminal untuk menjalankan server. Biasanya akan muncul http://localhost:8080, copy link tersebut untuk dijalankan di browser kalian.

npm run serve

Template Vue Argon

Sekian tutorial cara mudah melakukan instalasi dan menggunakan vue admin template. Kurang lebihnya saya mohon maaf, semoga bermanfaat bagi para pembaca sekalaian. Bagi yang masih kebingunan silahkan tinggalkan komentar kalian di bawah ini. Sampai jumpa di tutorial keren lainnya. Happy Coding. :)