Membuat Aplikasi Mobile Dengan Intel XDK

Membuat Aplikasi Mobile ( Android . Ios . WP ) Dengan Intel XDK " Hello World...! "

Salam Lestari ...!

Sekarang hampir semua orang punya yang namanya Smartphone , nah di sini saya mau Share aplikasi buatan Intel yang lumayan bagus , sebenernya aplikasi ini dulunya bukan punya intel. yang dulu itu kalo ga salah namanya appMob yang bisa di akses lewat browser , tapi sekarang di buat Programnya .

apa kelebihan aplikasi ini ? salah banyaknya adalah :

- Buat yang ga paham koding , and mau buat aplikasi sederhana bisa gunain aplikasi ini semudah Drag and drop - 1 kali koding bisa buat di publish ke beberapa OS salah 3 nya Android , Ios , Windows phone dan juga bisa buat windows 8 desktop and aplikasi crome - sampai saat ini aplikasi nya FREE . Alias gratis .

untuk download app nya bisa meluncur ke sini ----------- > [link]https://software.intel.com/en-us/intel-xdk[/link]

Ok buat Tuturial pertama kita bakal buat app sederhana , sampai app bisa kita debug di HP Android kita .

--------------------------------------------------------------------------------------------------------------------------------------------------------

01. Download app nya dulu di ya ini link downloadnya -----> [link]https://software.intel.com/en-us/intel-xdk[/link]

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/intel_1.png[/img]

02. Lalu di instal seperti biasa . dan ini tampilan awalnya , karna saya udah buat dua project jadi di gambar ini udah ada project yang aktif , kalo agan baru instal tampilanya kosong . untuk buat project baru , Klik start new project di pojok kiri bawah :

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/2_1459471925_12.png[/img]

03. dan ada 3 pilihan . - tamplates (pilih yang ini), - Samples and demos (sample simple app yang udah jadi ) , -inport html5 code (Bisa import game html5)

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/3_1459472143_229.png[/img]

04. pilih HTML+Cordova . untuk app mobile . jika *USE APP DESIGNERNYA di klik kita bisa pake beberapa framework yang tinggal tarik geser aja tanpa koding manual.

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/4_1459472150_937.png[/img]

05. tentukan di mana kita buat file and forder app nya , dan juga nama project nya :

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/intel_5.png[/img]

06. nah di sini kita pilih framework apa yang di gunakan :

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/7.png[/img]

08. Ini tampilan awal lembar kerja jika kita mengunakan Frameworks . kalo ga pake frame work kita bakal langsung di hadapkan sama file index.html buat mulai ngoding .

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/8.png[/img]

09. kita cuma perlu tarik geser element buat gunain Element Element yang ada di samping kiri ke lembar kerja warna putih di tengah . saya coba drag element button ke lembar kerja , kalo kita klik tandapanah kecil di samping kiri , maka akan ada menu untuk costumize sifat si button tadi , ini juga berlaku buat element lain kaya text , select gambar . dll :

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/9.png[/img]

10. sekarang saya drag TEXT ke lembar kerja . ketik kata kata sesuai keinginan . di sini saya pake " Hello World...! " .

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/10.png[/img]

11. ok, sekarang kita coba liat di emulatornya , klik tab EMULATE di atas :

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/intel_12.png[/img]

12. Belum puas pake emulator yang ada di aplikasinya ? ok sekarang kita pake device android untuk coba jalanin aplikasinya . caratanya login dulu di intyel account kalo belum punya account silakan buat dengan klik logo user di pojok kanan atas yang di lingkarin merah ini :

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/11 - Copy.png[/img]

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/intel_13.png[/img]

13. download aplikasi intel xdk App preview di Google Play

Bisa di downlod di sini ---> https://play.google.com/store/apps/details?id=com.intel.html5tools.apppreview

14. Jalankan aplikasi yang tadi di download di play store dan silakan login dengan account yang tadi di buat di aplikasi desktop .

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/Screenshot_2016-03-30-08-34-49(1).png[/img]

15. klik menu Server App di aplikasi android INtel XDK tadi .

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/Screenshot_2016-03-30-08-37-08(1).png[/img]

16. Pasti Belum ada aplikasi yang tadi kita buat kan ? . karna kita belum upload aplikasi tadi ke server . sekarang silakan buka aplikasi intel xdk di Desktop / pc kalian : dan pilih Tab "TEST" di bagian atas . *PC HARUS TERKONEKSI KE INTERNET

[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/push file.png[/img]

dan proses upload aplikasi ke server berjalan

17. kalo sudah ter upload . cek kembali aplikasi Intel XDK di android dan masuk ke menu servers apps yang tadi , jika berhasil seharusnya list app yang kita buat tadi sudah tampil. di sini aplikasi saya beri nama 'COBA1'

18. Klik List Aplikasi yang kita buat tadi , dan jalankan :

19. Dan , ini dia hasilnya . aplikasinya sudah bisa berlalan di Emulator android kita :

----------------------------------------------------------------------------------------------------------------------------------------------------------

Selesai , Semoga tutorialnya bermanfaat , di next tutorial kita bakal buat applikasi yang lebih dinamis , yang datanya di ambil dari database , , sebelum nya silakan pelajarin dulu beberapa kelas di bawah ini :

- http://www.sekolahkoding.com/kelas/video/belajar-crud-dengan-ajax-dan-php - http://www.sekolahkoding.com/kelas/video/Database%20dengan%20MySQLi%20dan%20PHP

Untuk referensi hasil import game HTML ke intel XDK yang saya buat bisa di liat video pendeknya di sini 15detik ----> https://www.instagram.com/p/BADi-IrsFa5DxUPo0M0yLJArXqSALENO2w1bc00/?taken-by=saputroandhi

Semoga Bermanfaat . Terima kasih .

Saputro andhi.