Aldi My Teacher is WWW. #Tidak ada rugi untuk belajar hal baru.

Cara Instalasi dan Cara Menjalankan Project Pertama di VueJS

1 min read

Cara Instalasi dan Cara Menjalankan Project Pertama di VueJS min min

Apa itu Vue.js

Vue.js adalah sebuah framework javascript untuk membangun antarmuka sebuah web yang interaktif. Untuk mempelajari Vue.js ini setidaknya kita harus sudah mengerti dasar dasar dari HTML,CSS, dan Javascript.

Install Node.js

1* bs6p5I6mSLvt1laZo8jJA

Hal yang kita butuhkan pertama kali yaitu kita di haruskan mengintal node.js yang dimana setelah kita mengintal node.js kita akan bertemu dengan yang namanya NPM. Apa itu NPM ? NPM adalah sebuah tool untuk mengatur package javascript yang menggunakan Javascript. Bila anda pengguna Laravel pasti mengenal Composer nah NPM ini seperti Composer versi node.js nya. NPM ini sangat dibutuhkan sebelum kita menginstal Vue js. Berikut Cara mengintall Node.js pada Windows.

1. Download Node.js installer di sini https://nodejs.org/en/download/

2. Jalankan file msi yang sudah di download tadi

3. Lakukan instalasi seperti biasa, dan tunggu hingga proses instalasi selesai

Pada tahap ini saya rasa kita sudah berhasil menginstal node.js dan untuk memastikan apakah node.js sudah terinstal di PC kita adalah dengan menjalankan perintah berikut di CMD :

node -v

1*jDlh63E4Z6IvWYq802z1NA

disini bisa dilihat versi node.js saya yaitu v10.13.0

Install Vue.js

Agar tidak terjadi error saya sarankan untuk membersihkan cache terlebih dahulu dengan menjalankan perintah berikut

npm cache clean --force

Setelah itu install vue.js dengan menggunakan perintah berikut :

npm install -g @vue/cli

Langkah instalasi sudah selasai selanjutnya kita akan mencoba membuat project pertama kita.


Membuat Project

Lagkah pertama anda pastikan terlebih dahulu dimana anda akan menyimpan project anda agar tidak sulit mencarinya.

Untuk membuat project anda tinggal jalankan perintah berikut ini.

vue create "nama-peroject-anda" (tanpa tanda petik)

Setelah itu akan muncul opsi dan , pilih saja 

1*Oscb b ofXuWT3YR7zuOiA

Tunggu hingga proses pembuatan project selesai. Jika berhasil maka akan muncul pesan 

1*6kuoKK6pkx iinufh riPQ

setelah project berhasil dibuat saat kita jalankan dengan menggunakan perintah berikut :

npm run serve

Bila sudah maka akan tampil seperti ini

1*p WMPXqTk GeTUAlqpLT0A

Kita tinggal akses localhost yang telah kita terima di browser kesayangan kit di sana localhost saya yaitu localhost:8081

Dan Selamat kita sudah berhasil membuat project vue

1*MYSVsa adGn0cBduR7mvLQ

Selesai 🙂

 

Aldi My Teacher is WWW. #Tidak ada rugi untuk belajar hal baru.

Leave a Reply

Your email address will not be published. Required fields are marked *