Phonegap adalah sebuah framework yang memudahkan kita untuk membuat sebuah aplikasi pada platform android, iOS dan Blackberry dengan cara menjembatani antara kode pemrograman pada masing-masing platform dengan web programming (HTML, CSS, Javascript). Bahasa mudahnya adalah kita membuat web server sendiri didalam smartphone kita
Peralatan perang yang dibutuhkan :
- Eclipse IDE
- Android SDK (Software Development Kit)
- Plugin ADT Eclipse
- Java SE Development Kit (JDK) (http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads-1880260.html)
- Apache Ant (http://www.ant.apache.org)
- Phonegap Framework (http://www.phonegap.com)
- Bluestack {optional}
Note : Biasanya sudah ada paket bundle yang terdiri dari Android SDK, Eclipse dan plugin ADT. Jadi gak perlu lagi download satu-satu
Perangkat perang tersebut berguna sebagai :
- Eclipse berguna sebagai tempat kita memasukkan baris-baris program.
- Android SDK menyediakan kebutuhan-kebutuhan untuk membuat aplikasi android.
- Plugin ADT digunakan untuk memperluas kemampuan eclipse dalam mendukung pembuatan aplikasi android.
- JDK aplikasi yang diperlukan agar eclipse dapat berjalan.
- Apache Ant berfungsi untuk membuat secara otomatis proses build aplikasi.
- Bluestack sebagai emulator android yang berjalan terpisah.
Cara Instalasi :
- Install JDK, lakukan instalasi seperti biasa (i agree, next, yah seperti itu lah)
- Ekstrak file Apache Ant dan Phonegap kedalam sebuah folder. Misal : C:\android
- Lakukan konfigurasi PATH untuk memudahkan kita mengakses JDK, Apache Ant dengan cara :
- Klik kanan pada Computer -> Properties -> Klik Advances system settings -> Pada tab Advanced klik tombol Environment Variables -> Klik Tombol New yang ada dibawah kotak System Variables
- Isi Variable name dengan : ANT_HOME kemudian isi Variable value dengan folder tempat hasil ekstrak tadi.Ă‚ Misal : C:\android\apache-ant-1.9.3
- Buat lagi dengan isi variable name dengan : JAVA_HOME dan variable value dengan : Tempat hasil instalasi JDK, biasanya terletak di : C:\Program Files\Java\jdkx.xx.xxx
- Cari variable Path kemudian klik tombol Edit, tambahkan : %JAVA_HOME%\bin;%ANT_HOME%\bin;
- Tambahkan lagi pada variable Path folder android SDK, biasanya terletak dalam 1 folder bersama dengan eclipse, hanya saja berada pada pada folder sdk\tools. Misal : C:\android\adt-bundle-windows-x86-20130917\sdk\tools;
Selesai. Kira-kira begitu lah cara instalasi phonegap…
Lho, gimana cara buat aplikasinya? Cara buatnya :
- Masuk command prompt ( Start Menu -> search -> cmd)
- Masuk ke dalam folder phonegap. Misal : cd c:\android\phonegap-x.x.x\lib\android\bin
- Ketikkan perintah : create {folder_project_path} {package_name} {project_name}. Contoh : create d:\android\workspace\helloWorld com.simoyo.helloWorld helloWorld
- Jika berhasil maka akan muncul tulisan :
Creating new android project…
Copying template files…
Copying js, jar & config.xml files…
Copying cordova command tools…
Updating AndroidManifest.xml and Main Activity… - Jika terdapat kesalahan :
Missing one of the following :
JDK : http://java.oracle.com
Android SDK : http://developer.android.com
Apache ant : http://ant.apache.orgPastikan konfigurasi PATH telah dilakukan dengan benar ( lihat pada step instalasi) - Setelah berjalan dengan baik. Buka eclipse.
- Pilih menu File -> New -> Project
- Pada halaman New Project pilih Android -> Android Project from Existing Code -> klik tombol next -> lalu buka folder tempat hasil build dari phonegap -> centang folder tersebut -> klik finish.
- Jika terdapat tanda silang merah pada project yang telah dibuat maka lakukan hal ini :
- Klik kanan pada project (icon dokumen yang terselip kertas) -> klik Properties
- Klik properti Android -> pada Project Build Target, pilih level Android yang paling tinggi -> Klik Ok
- Pada bagian menu di atas , Klik Project -> Clean. - Untuk menjalankan hasil build dari phonegap :
- Klik kanan pada project (icon dokumen yang terselip kertas) -> klik Run As -> Android Application
- Pilih emulator yang ingin dipakai untuk menjalankan aplikasi tersebut.
Selesai… Kita telah membuat sebuah aplikasi sederhana ala Phonegap.
Pada post berikutnya saya akan mencoba untuk menjelaskan bagaimana cara kita membuat aplikasi kita sendiri dengan menggunakan Phonegap hanya dengan bermodalkan HTML, CSS, dan Javascript.
Silahkan lihat video tutorial install phonegap dibawah
EmoticonEmoticon