Langkah-langkah Instalasi Ionic & Cordova

Langkah-langkah Instalasi Ionic & Cordova
October 13, 2015 mirzailhami
In Tutorial

Sepertinya masih banyak yang bermasalah ketika instalasi Ionic di Windows. Saya akan bantu melalui tulisan ini. Untuk videonya sedang saya siapkan, InsyaAllah jika waktu memungkinkan bisa selesai segera. Seperti yang pernah saya posting sebelumya, langkah dalam instalasi Ionic adalah sebagai berikut:

1. Download & Install Java
Buka cmd dan ketikkan “java -version”, jika yang muncul disana adalah versi Java dari komputer Anda, maka itu artinya Java telah telah tersedia. Jika belum tersedia, silahkan download dan instal JDK (Java Development Kit) versi terbaru di:

http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

Setelah proses instalasi selesai, silahkan kembali cmd dan ketikkan kembali “java -version”. Harusnya sekarang sudah tampil versi dari Java yang Anda install.

2. Apache ANT
Apache ANT nantinya akan dibutuhkan oleh Android dan Cordova saat kita memulai projek dengan Ionic. Untuk ANT silahkan download terlebih dahulu melalui:

http://mirror.tcpdiag.net/apache/ant/binaries/apache-ant-1.9.6-bin

Setelah download, ekstrak folder ANT tersebut di direktori C:. Terakhir, tambahkan paht bin dari folder ANT tersebut kedalam variabel Path di environment settings Anda.

3. Dowload & Install Android SDK
Android SDK dibutuhkan oleh Ionic agar projek Anda nantinya dapat di compile dan running di platform Android, baik device maupun emulator. Silahkan download terlebih dahulu Android SDK melalui:

http://dl.google.com/android/installer_r24.3.4-windows.exe

Instal dan letakkan di direktori yang Anda inginkan. Hasil dari instalasi Android SDK ini adalah berupa folder SDK dengan beberapa folder didalmnya dan 2 file yaitu: AVD Manager & SDK Manager.

Sekarang buka file SDK Manager, pada menu Tools, centang “Android SDK Build-tools. Kemudian juga, pilih versi Android terbaru, dan centang “SDK Platform”. Klik tombol Install package. Tunggu hingga proses instalasi selesai.

4. Tambahkan Android ke Path Environment
Sambil nunggu instalasi, silahkan buka environment setting untuk mengatur Path dari Android SDK. Copy path dari folder tools & platforms-tool dari folder Android SDK Anda ke variabel PATH di environment settings.

Buka kembali cmd, dan ketikkan perintah “android”. Jika yang muncul adalah Android SDK Manager, maka konfigurasi Android Anda telah ok.

5. Install Node.js
Node.js merupakan librari yang cukup powerful dan digunakan oleh Cordova & Ionic. Silahkan download nodejs melalui:

http://nodejs.org/

Silahkan install Node.js di direktori C, seperti biasanya dan tunggu hingga selesai. Buka kembali cmd dan ketikkan perintah “node -v”, jika yang tampil adalah versi Node.js, maka artinya Node.js Anda telah ok.

Jika perintah “node -v” belum bisa jalan, maka silahkan copy path dari folder /bin dari hasil instalasi tadi (biasanya di C:Program Filesnodejsbin) ke Path variabel dari environment settings Anda.

6. Instalasi Ionic & Cordova
Tahapan terakhir adalah instalasi Ionic & Cordova. Caranya buka kembali cmd dan ketikkan perintah “npm install -g ionic cordova”. Tunggu higga proses instalasi selesai.

Ok, sekarang Ionic sudah dapat digunakan.

Untuk testing, dari cmd silahkan ketikkan “ionic start TestingApp tabs”, tunggu hingga proses instalasi selesai. Jika tidak ada error apapun, maka Ionic Anda sudah bisa digunakan. Congrats!

Bagi yang ingin mendapatkan notifikasi postingan terbaru saya, bisa gabung di grup kami di Facebook. Namanya “Jago Bikin Aplikasi Smartphone”, ini linknya: https://www.facebook.com/groups/jago.apps

Makasih ya, ajak yang lain.
————-
References:

1. http://learn.ionicframework.com/videos/windows-android/
2. http://ionicframework.com/docs/guide/installation.html
3. http://dl.google.com/android/installer_r24.3.4-windows.exe
4. http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
5. http://nodejs.org/
6. http://mirror.tcpdiag.net/apache//ant/binaries/apache-ant-1.9.4-bin
7. http://mirzailhami.com/inspirasi/kenalan-dengan-framework-ionic/

  • igun wiguna Saputra

    Maaf mas, link untuk download Apache ANT nya tidak bisa diakses

  • Hafidh Fathul

    folder environtment setting yang dimaksudkan folder apa ya? bin dari berbagai folder yg diinstall dijadikan satu ya?

    • coba ketik “environment settings” di layar start windows-nya

  • Mohamad Mansur

    Sama gan…ane juga error instalasi ionic nya…bingung cara ngepatch nya…pada android sdk