Setup Projek Angular 2


Apa itu Angular?
Angular merupakan framework untuk menciptakan aplikasi web yang dinamik.
Pada tahun 2009 Miško Hevery and Adam Abrons mehasilkan project bernama <angular /> dengan tujuan untuk membantu developers dan designer saat membangun aplikasi web dengan simple tag HTML.

Saat ini Angular telah berkembang hingga versi Angular 2. Dalam artikel ini saya akan membagi pengalaman dalam men-setup project menggunakan Angular 2.

Note dalam artikel ini saya menggunakan Windows 10

Aplikasi yang digunakan
  • Node JS
  • Visual Studio Code
  • Angular-CLI

Install NodeJS
Download Node JS pada halaman nodejs.org. Untuk versi stabil pilih yang LTS.
Kemudian install dan ikuti proses instalasi. Saat ini saya menggunakan node js versi v6.9.5.

Install Visual Studio Code
Download Visual Studio Code pada halaman visualstudio.com. Visual Studio Code sangat baik digunakan sebagai IDE untuk project Angular Install dan ikuti proses instalasi.

Install Angular CLI
Angular CLI merupakan plugin dari node package manager (npm via NodeJS). Angular CLI memudahkan kita untuk mehasilkan struktur file pada project Angular
Buka command prompt (cmd) dan kemudian ketikkan sintaks npm:

npm install -g @angular/cli

Generate Projek Angular 2
Untuk meng-generate struktur file Angular 2 dapat dilakukan dengan sintaks berikut.
Masih dalam cmd, ketikkan

ng new nama-aplikasi --skip-git

Skip git di gunakan melawati tahapan GIT repository
Untuk menjalakan aplikasi gunakan sintaks berikut, masuk ke dalam folder aplikasi terlebih dahulu

cd nama-aplikasi

Kemudian lanjutkan dengan perintah serve yg di sediakan oleh Angular-CLI

ng serve

Buka browser kemudian arahkan ke http://localhost:4200/
Anda dapat memodifikasi file project dengan menggunkan IDE Visual Studion Code.

Selamat anda siap mebuat aplikasi dengan Angular 2!

Comments

Post a Comment

Popular posts from this blog

Crypto Tracker App dengan Ionic 3: Setup aplikasi

Image
Ionic adalah framework yg dapat digunakan untuk mengembangkan aplikasi mobile hybrid. Dengan menggunakan Ionic kita bisa mengenerate aplikasi untuk Ios, Android maupun web. Dalam seri tutorial ini kita akan belajar membuat aplikasi dengan menggunakan Ionic versi 3. Kita memerlukan Node.js untuk develop aplikasi dengan Ionic CLI. Pastikan Node.js telah terinstall pada komputer. Sebelum memulai tutorial ini ada baiknya bila anda telah paham setidaknya sintaks dasar dan struktur dari Ionic framework. Hal ini tentunya akan membantu mempercepat dalam pemahaman code yg ada dalam seri ini. Sebelum memulai tutorial ini ada baiknya bila anda telah paham setidaknya sintaks dasar dan struktur dari Ionic framework. Dalam tutorial ini kita akan melihat bagaimana langkah awal setup dan membuat aplikasi dengan Ionic. Ionic CLI Install Ionic CLI dan cordova dengan sintaks berikut: npm install -g ionic@latest cordova Setelah selesai terinstall lanjutkan dengan membuat project dengan ionic
Read more

JMeter for Windows 7

Image
Environment Used - Windows 7 - JMeter 2.7 - JDK 1.6.0 or later - Command Prompt Installation Procedures I have task about performance testing for our local project. I am using JMeter for this kind of task and this application (JMeter) is open source application by Apache. I think JMeter is good for JavaEE developer, I haven't tried using JMeter for other platform than Java yet. JMeter need Java to running application, so we would have Java on our OS before we run JMeter application. Below are steps for JDK instalation: 1. Install JDK for Windows 7, JDK could be donwloaded at this site (http://www.oracle.com/technetwork/java/javase/downloads/index.html). I am using JDK 1.6.0 but this tutorial also good for latest JDK e.g. JDK 1.7.0 2. After JDK installation finish, we should setup JAVA_HOME at environment variables. Right click on Computer then select 'properties' 3. Choose 'Advanced System settings' 4. Click on Environment Variables... butt
Read more

Pricise Pangolin meet Gimp 2.8

Image
Environment Used - Ubuntu 12.04 - Gimp - Software Center - Ubuntu Pricise Pangolin (12.04) Procedure Instalation I like using Gimp since I can't find Phosothop on Ubuntu. Gimp is more than enough to meet my daily editing photo. Gimp latest version (2.8) introduces single window mode that makes me more than happy. Remove Previous Gimp Only one Gimp application should installed on your machine. Make sure you already remove Gimp previous version. 1. Open Ubuntu Software Center 2. Type "Gimp" on search 3. Check if version below than 2.8, then click remove button Install Gimp 2.8 Now we are ready to install new Gimp (version 2.8) 1. Open Terminal 2. Add PPA by run command below sudo add-apt-repository ppa:otto-kesselgulasch/gimp 3. Update repository sudo apt-get update 4. Install gimp sudo apt-get install gimp 5. Open Gimp 6. To set single window, go to Window -> single window
Read more