Home / Android / Tutorial Singkat : Instalasi Ionic Framework Untuk Aplikasi HTML5

Tutorial Singkat : Instalasi Ionic Framework Untuk Aplikasi HTML5

Ionic merupakan framework untuk mengembangkan aplikasi mobile hybrid berbasis HTML5 dengan menggunakan teknologi cordova dan angular. Saat ini ionic versi terbaru adalah versi 2 (beta). Salah satu kelebihan ionic dibanding framework hybrid HTML5 lainnya adalah kecepatan.

Instalasi

Untuk instalasi ionic dependensi yang dibutuhkan adalah aplikasi node.js. Jadi pastikan anda sudah mempunyai node.js pada komputer anda. Untuk menginstall aplikasi node.js bisa didownload di sini (nodejs.org).

Perintah yang dijalankan untuk instalasi ionic :

npm install -g ionic cordova

Untuk di linux dan mac biasanya membutuhkan sudo, terganti konfigurasi yang dimiliki sistem Anda.

Membuat Project

Untuk membuat project cukup mudah. Untuk ionic versi 1, terdapat 3 jenis starter template untuk memudahkan, yaitu : blank, tabs dan sidemenu. Ada baiknya untuk memulai pertama kali menggunakan blank. Perintah yang dijalankan :

ionic start helloApp blank

maka selanjutnya ionic akan menjalankan konfigurasi yang dibutuhkan untuk menghasil aplikasi blank.

Menjalankan

Jika sudah berhasil membuat project, maka selanjutnya kita akan mencoba menjalankan project tersebut. Masuklah ke dalam direktori project tersebut :

 cd helloApp

untuk menjalankan di browser cukup dengan menjalankan :

 ionic serve

maka Anda dapat memeriksa melalui browser dengan menjalankan http://localhost:8001

Untuk menjalankan di platform android atau ios, anda perlu menambahkan platform ada project tersebut.

 ionic platform add ios

atau

 ionic platform add android

untuk menjalankan kedua platform tersebut membutuhkan dependensi sesuai dengan platformnya. Seperti android, maka membutuhkan Java, Android SDK. Sementara untuk ios membutuhkan xcode. Untuk mengetahui apakah dependensi yang dibutuhkan sudah memenuhi dapat menjalankan perintah :

 ionic requirements

Untuk menjalankan pada emulator, dapat menjalankan perintah :

 ionic emulate android

atau

 ionic emulate ios

maka akan menjalankan emulator default. Untuk melihat dan memilih emulator yang tersedia dapat menjalankan :

 ionic emulate ios -list

dan untuk emulator tertentu dapat menjalankan :

 ionic emulate ios -target="iPhone-4s, 9.3"

Untuk bisa menjalankan ke real device, dapat dengan menjalankan :


atau 

<pre> ionic run ios

pastikan device anda sudah terhubung dan terdeteksi. sekian

About alfach

Check Also

picasso

Menampilkan Image/Gambar dari Url Pada Android Menggunakan Picasso

Menampilkan image pada android merupakan hal yang gampang-gampang susah apalagi jika image tersebut diambil dari ...

Leave a Reply

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>