Berkenalan Dengan Angular CLI

Halo para pembaca, kali ini saya ingin berbagi pengalaman sekaligus tutorial tentang Angular. Teman-teman udah tau belum Angular itu apa?

Angular adalah sebuah Kerangka Kerja (Framework) aplikasi web yang bersifat open source. Angular di bangun dan di kembangkan oleh Tim Angular di Google. Angular sendiri meggunakan Bahasa Pemoggraman TypeScript, dimana bahasa ini diperkenalkan oleh Microsoft untuk mempermudah Developer membuat aplikasi web berskala besar berbasis Javascript.

Untuk teman-teman perlu ketahui, Angular ini punya banyak versi ya, di antaranya ada Angular Versi 1 atau biasa disebut AngularJS yang dapat teman-teman temui di www.angularjs.org sementara untuk Versi 2 dan seterusnya dapat ditemui pada situs www.angular.io Pada saat artikel ini saya tulis, Angular sudah berada pada Versi 7.

Judulnya kok Angular CLI ?

Nah, CLI adalah singkatan dari Command Line Interface yang artinya teman-teman dapat mengetikkan perintah melalui Command Prompt mulai dari Instalasi, pembuatan Module, Component, Service dan lain-lain.

Persiapan

Untuk memulai bekerja dengan Framework Angular, pastikan teman-teman telah menginstal NodeJS terlebih dahulu. Untuk proses install NodeJS silahkan lihat dokumentasi di situs resmi nya ya.

Setelah itu yang wajib teman-teman punyai adalah aplikasi Text Editor. Saya menyarankan untuk menggunakan Visual Studio Code. Namun itu semua kembali kepada kenyamanan kita masing-masing. 

Selanjutnya adalah Git, namun ini bersifat opsional. Karena teman-teman masih bisa menggunakan Command Prompt bawaan windows.

Node.js/download/button Visual Studio Code/download/button Git For Windows/download/button

Instalasi

Selanjutnya kita tinggal install Angular Global. Instalasi Angular Global ini hanya dilakukan sekali. Cara nya silahkan buka Command Prompt, terserah mau di Desktop, Local Disc C, D, E. Untuk pengguna Windows 7 silahkan Klik Kanan sambil menahan tombol SHIFT lalu pilih "Open command window here". Sementara untuk pengguna Windows 10 silahkan Klik Kanan sambil menahan tombol SHIFT lalu pilih "Open PowerShell window here". Atau dengan cara yang lebih gampang jika teman-teman sudah download dan install Git For Windows di atas, maka teman-teman cukup Klik Kanan lalu pilih "Git Bash Here"

Setelah itu silahkan ketikkan perintah untuk mengintal Angular Global:

npm install -g @angular/cli

Project Baru

Untuk membuat project baru, teman-teman silahkan buka Command Prompt di Local Disk manapun dan ketikkan perintah berikut untuk membuat project baru :

ng new Latihan-Angular-Pertama

Perintah tersebut otomatis akan membuatkan sebuah folder baru bernama "Latihan-Angular-Pertama" yang berisikan project Angular kita. Prosesnya memang agak memakan waktu lama tergantung dari koneksi internet yang teman-teman pakai.

Jalankan

Masih di Command Prompt yang sama, setelah proses pembuatan projectnya selesai, langkah selanjutnya teman-teman ketikkan perintah berikut:

cd Latihan-Angular-Pertama

Itu adalah perintah untuk masuk ke folder project yang berusan kita buat. Untuk menjalankan, ketikkan perintah berikut:

ng serve

Jika proses compile selesai, silahkan buka Browser kesayangan teman-teman dan akses http://localhost:4200/ 

Sampai disini, teman-teman sudah berhasil membuat project baru Angular. Salah satu kelebihan yang saya suka adalah kemampuan Hot Reload, yaitu Angular akan secara otomatis reload di browser ketika teman-teman melakukan perubahan terhadap project.

Cukup sekian artikel kali ini, tunggu artikel selanjutnya ya. Kalau kalian suka dengan artikel ini, silahkan bagikan dan tinggalkan jejak di kolom komentar. Terimakasih.