Cara Instal Ionic Framework di Windows 7 / 8 / 10

Boimeningkat.com - Sebelum memulai untuk memasang atau instal aplikasi ionic framework ini di windows, kamu harus memiliki beberapa aplikasi pendukung atau bisa saja disebut plugin. Ionic digunakan untuk membangun sebuah aplikasi mobile dengan menggunakan bahasa website seperti HTML5, CSS, PHP serta javascript dan lainnya.

Hal yang perlu diperhatikan dan kamu download terlebih dahulu sebelum melakukan pemasangan ionic di windows kamu. Ionic adalah sebuah web developer build untuk para developer untuk membuat aplikasi berbasis hybrid apple, android, ios dan sebagainya.

1. Git Windows

Kamu dapat mendownload di link berikut dengan mengunjungi situs Git Windows untuk ionic di google atau mengunjungi Link: Git Windows

Git Windows

2. Membutuhkana NodeJs

Kamu bisa mendownload NoeJs untuk keperluan ionic melalui pencari google dengan mengetikan download NodeJs atau dengan mengunjungi Link: NodeJs

Node Js

3. Aplikasi Command Prompt Windows

Aplikasi CMD adalah aplikasi terminal windows bawaan atau default sudah ada di system windows sendiri baik windows 7, windows 8, windows 10 dan lain-lain.

Command Prompt Windows 7 / 8 / 10

4. Java JDK Update

Aplikasi JDK adalah aplikasi yang dibutuhkan untuk penginstalan atau pemasangan program ionic di komputer kamu. Dengan menginstall terbaru dan mengubah path di PC kamu dapat menjalankan ionic nantinya. Untuk mendownload JDK Update terbaru kamu dapat mengetikan di google dengan katak kunci Download Java JDK atau dengan cara mengunjungi link: Java JDK 

Tampilan Download Java JDK Terbaru Update 2020

Cara Install Ionic Framework di Windows

Logo ionic

1. Pertama Install JDK Path Terbaru

Proses penginstalan biarkan saja di folder default yaitu C:\Program Files\Java\jdk-15.0.1\ agar tutorial kali ini dapat kamu ikutin dengan baik. Tunggu pemasangan jdk terbaru pada komputer kamu seperti gambar berikut.

2. Lanjut ke langkah berikutnya. Penginstalan nodeJs angular pada komputer kamu.

Lakukan penginstalan secara menyeluruh dan biarkan path folder instal default dan juga component seperti berikut C:\Program Files\nodejs\ next. Sampai selesai seperti gambar berikut ini

Klik finish. Selesai

Dan apabila ada tampilan aneh saat proses penginstalan ionic, silahkan letakan komentar kamu dibawah postingan beirkut ini ya.

Beberapa kasus saat proses pemasangan nodeJs akan banyak kasus, misalkan sepeperti kasus dimana muncul tampilan Shell di komputer ketika selesai pemasangan nodeJs

** Tampilan diatas, Disarankan menunggu tampilan tersebut sampai selesai pemasangan beberapa plugin atau directory misalkan seperti python dan visual studio. Dibutuhkan koneksi internet agar pemasangan tersebut dapat dilakukan sampai selesai 100% dan penuh sabar.

Setelah semua selesai. Reqruitment untuk penginstalan Ionic. Kembali lagi ke situs Ionic Framework di ionicframework.com untuk memahami lebih banyak tentang ionic.

3. Selanjutnya pada pada Enviroment Variables ubah dan arahkan ke java sdk bin terbaru secara default yaitu C:\Program Files\Java\jdk-15.0.1\bin

4. Langkah semua nya sudah terinstal, Agar dapat menginstall ionic adalah dengan cara membuka Command Prompt secara Administrator ya. Seperti gambar berikut

Selanjutnya menginstal ionic dengan mengetikkan npm install -g ionic dan pastikan koneksi internet mu lancar dan tidak lelet. Gambar proses instal npm seperti berikut.

5. Setelah pemasangan semua selesai dengan benar,  maka kamu bisa membuat aplikasi pertama di ionic dengan menggunakan perintah ionic start myApp tabs dan kamu bisa memilih framework Angular atau React

Seperti pada gambar berikut

Pada konteks diatas, kita memilih angular js dahulu ya. Dengan menekan tombol keyboard kamu dapat memilih kebawah dan keatas. Lalu tekan enter.

Proses pemasangan ionic untuk folder app kamu akan siap di pasang menggunakan framework ionic, pastikan koneksi internet kamu stabil dan kencang sampai semua terpasang dengan baik. Seperti gambar berikut ini

Ketikan saja yes atau Y untuk informasi selanjutnya, segala data aktivitas kamu di amankan atau dibawah aturan google.

Selesai tampilan project berhasil di create dengan nama Myapp seperti tampilan berikut ini

Penjelasan beberapa Next Steps diatas adalah;

cd .\myApp adalah nama directory atau folder yang berhasil di create tadi dengan perintah started ionic diatas kalau teman-teman ingat kita pernah mengetikan perintah tersebut. Lalu terbentuklah folder dengan project yang sudah di download ke dalam komputer PC kamu sendiri

ionic serve adalah perintah untuk menjalankan program project yang sudah dibuat tadi, agar dapat ditampilkan di browser atau smartphone dibutuh perintah ionic serve tersebut

Silahkan masuk ke folder myApp dengan mengetikan perintah cd myApp maka directory path di command prompt akan berubah dari D:\BOIM\  menjadi D:\BOIM\myApp\ seperti terlihat pada gambar berikut ini

Selanjutnya untuk menjalankan project tersebut cukup ketikan perintah ionic serve pada directory yang sudah diubah sebelumnya. Seperti tampilan berikut

Selanjutnya compiling project berhasil dan akan membuka sebuah jendela default browser kamu. Project ditampilkan layaknya aplikasi android yang berada dan tampil dibrowser. Seperti gambar contoh berikut

Sukses dan selesai pemasangan ionic beserta pembuatan project pertama di ionic terbaru 2020, Cara install ionic framework di windows dapat kamu coba pada versi Windows 7 / 8 / 10 dengan details yang hampir mirip prosesnya.

Apabila kamu memiliki keluh kesah pada langkah dan tutorial diatas, boleh kamu berikan komentar agar saya bisa bantu jawab. Terima kasih.