Tutorial Lengkap Membuat Aplikasi Mobile dengan Ionic

Pada tutorial ini saya memfokuskan pembuatan aplikasi android yang membutuhkan tools yang berbeda dengan aplikasi iOS.

Instalasi software yang dibutuhkan

1. Download dan install software Git disini https://git-scm.com/downloads
2. Download dan install software Node.js versi LTS disini https://nodejs.org/en/download/
3. Jika kedua software di atas sudah di install, selanjutnya buka CMD (command prompt)
4. Ketik di cmd sebagai berikut :

   npm -v

5. Maka akan muncul versi yang terlah terinstall seperti dibawah ini
6. Selanjutnya, kita akan install ionic cordova. Ketic di cmd sebagi berikut :

   npm install -g cordova

7. Setelah itu plugin ionic cordova akan di install ke dalam sistem. Tunggu sampai statusya selesai.
8. Untuk mengetesnya ketik sebagai berikut

   cordova -v

9. Maka veris cordova yang telah di instal akan tampil di cmd
10. Selanjutnya kita install ionic dengan mengetikan di cmd sebagai berikut

    npm install -g ionic

11. Jika selesai di install, cek versinya sebagai berkut

    ionic -v

12. Maka akan muncul versi ionic yang telah di install
13. Selanjutnya kita install bower, yaitu sebuah package manager yang dibutuhkan dalam membuat aplikasi ionic, caranya dengan mengetikan di cmd sebagai berikut

    npm install -g bower

14. Untuk memastikan bower sudah terintall, cek versinya sebagai berikut

    bower -v

15. Maka akan tampil seperti gambar dibawah ini
16. Install juga gulp yang merupakan sebuah library javascript yang dibutuhkan untuk membuat aplikasi berbasis framwork ionic, dengan mengetikan di cmd sebagai berikut

    npm install -g gulp

17. cek versi nya juga dengan mengetik

    gulp -v

18. Maka akan seperti pada gambar berikut
19. Selesai, kita sudah mengintall semua tools untuk frameword ionic yang dibutuhkan
20. Kamu bisa membersihkan tampilan cmd dengan perintah CLS untuk memudahkan mengetik perintah baru

Membuat Project Baru

1. Langkah selanjutnya ialah membuat project baru, buat folder baru misalkan di drive E dengan nama folder terserah yang kami inginkan misalkan Latihan
2. Buka cmd lalu arahkan ke folder Latihan ketikan baris perintah berikut untuk membuat project dengan nama demoapp.

   ionic start demoapp

3. Maka library ionic pada project demoapp akan di download
4. Jika muncul pesan untuk membuat push notification dilewatkan saja dengan mengetik n, lalu enter.
5. Selesai, kini project demoapp sudah selesai dibuat dan bisa dijalankan.

Menjalankan Project Demoapp

1. Buka cmd, pastikan sudah berada pada direktori demoapp, lalu ketikan kode berikut

   ionic serve

2. Sehingga muncul seperti ini
3. Maka secara otomatis browser akan kebuka dan menjalankan project demeoapp default bawaan ionic-nya
   

Menjalankan Project Ionic di Platform Android

1. Berikutnya kita akan menjalankannya di android dan akan membuat file apk-nya
2. Buka cmd, pastikan posisi folder berada di demoapp. Ketik di cmd dengan perintah dibawah, lalu enter

   ionic platform add android

3. Tunggu sampai selesai di download, setelah itu kita akan build andorid apk nya, ketik di cmd perintah berikut

   ionic build android

4. Tunggu sampai program android selesai di build, dan akan menampilkan pesan build successful
5. Selanjutnya, jalankan emulator androidnya dengan perintah berikut ini

   ionic emulate android

6. Tunggu sampai emulator androidnya jalan, jika sudah maka aplikasi android demoapp akan jalan di emulator tersebut
7. Selesai.