1.Pengenalan
Kali ini aku akan membahas IONIC framework , apa itu IONIC?
IONIC yakni sebuah framework untuk menghasilkan sebuah aplikasi mobile hybrid , menggunakan HTML , CSS , JS (JavaScript) dan menggunakan teknologi CORDOVA. Sebenarnya bukan cuma CORDOVA , ionic juga dapat menggunakan CAPACITOR , cuma saja kalau CAPACITOR ini belum stabil , tidak menyerupai CORDOVA.
2. Installasi
di panduan ini kita menginstall ionic v4+ (versi modern dari ionic).
Bahan-bahan untuk menggunakan IONIC sebenanya cuma node js , tetapi jikalau teman-teman ingin membuild nya menjadi bentuk apk maka teman-teman membutuhkan:
- node js (saran aku minimal model 6 dan pilih yang LTS) download disini
- JDK (saran aku minimal model 8) download disini
- Android Studio (sudah sepaket dengan SDK android jikalau teman-teman install Android Studio) download disini
jika teman-teman sudah download dan install , maka selanjutnya mengendalikan environment variable nya , kebetulan di panduan ini aku menggunakan OS windows 10 maka langkah-langkahnya juga mengendalikan environment variable di windows.
cara mengaturnya menyerupai ini:
1. masuk ke windows explorer
2. klik kanan pada this PC kemudian pilih properties
3. klik advenced system settings
4. klik Environment Variable (di atas tombol cancel)
5. Setelah masuk ke pengaturan environment variable , teman-teman menghasilkan variable gres di bab System variable , dan klik tombol new (di gambar sudah aku kasih tanda)
dengan nama variable ANDROID_HOME valuenya di arahkan ke folder sdk android (anda , jikalau beda letak foldernya dapat sesuaikan dengan letak folder di PC/laptop teman-teman) , kalau aku set menyerupai ini , jikalau sudah klik OK.
6. menghasilkan variable gres dengan nama JAVA_HOME dan valuenya di arahkan ke folder Java(anda , jikalau beda letak foldernya dapat sesuaikan dengan letak folder di PC/laptop teman-teman) , kalau aku set menyerupai ini , jikalau sudah klik OK.
7. edit pada bab path (lihat gambar di langkah no 5) , dan tambahkan menyerupai ini
8. Jika sudah , jangan lupa klik OK semua jendela yang terbuka untuk mengendalikan environment variable kemudian restrart PC/laptopnya.
9. selanjutnya kita ke tahap create project ionic , tetapi sebelumnya cek dahulu node js dan npm nya sudah sungguh-sungguh terinstall belum , caranya buka CMD kemudian ketikan perintah berikut :
- untuk cek node js ketikan perintah: node -v
- untuk cek npm ketikan perintah: npm -v
10. Create Project Ionic
ketika create project teman-teman mesti terhubung ke internet!
langkah-langkah :
a. buat folder di drive mana saja (saran aku jangan di drive C)
b. jikalau sudah , buka cmd dan arahkan ke folder yang gres dibentuk tadi (perhatikan gambar di bawah baik-baik) kalau aku nama foldernya projectIonic terletak di drive D , kemudian ketikan perintah berikut : npm install -g ionic cordova
c. tunggu hingga tamat , jikalau sudah tamat gres kita create project dengan cara mengetikkan perintah berikut : ionic start myApp blank
Sedikit klarifikasi dari perintah di atas :
- ionic start
perintah untuk mulai menghasilkan project ionic.
- myApp
nama untuk project ionic yang kita buat.
- blank (macam-macam template ionic blank , tabs , sidemenu)
nama template yang di gunakan.
Karena kita mengetikkan perintahnya menyerupai di atas , maka kita akan menggunakan angular (default dari ionic) di project kita nanti. Jika sudah tamat teman-teman ketikkan perintah berikut : cd myApp
d. dan kemudian ketikan lagi perintah : ionic serve
e. tunggu hingga tamat , dan nanti akan keluar menyerupai ini di browser
supaya performa browser dapat menyerupai performa mobile , jikalau menggunakan google chrome teman-teman dapat tekan shortcut ctrl+shift+i
Sekian panduan dari aku , untuk panduan selanjutnya dapat klik disini. Semoga bermanfa'at :)
Wassalamu'alaikum Wr Wb
Tidak ada komentar:
Posting Komentar