femaledev -- html5 mobile apps
Post on 01-Nov-2014
1.472 Views
Preview:
DESCRIPTION
TRANSCRIPT
HTML5 FOR MOBILE APPS
Oon Arf iandwi <oon@oo.or. id> | ht tp: / /oo.or. id/html5/ / femaledev Dec 14th, 2013
http: / /en.wik ipedia.org/wik i /Fi le:Prambanan_Complex_1. jpg
HELLO WORLD!๏ Hi Female Developers! my name is Oon Arfiandwi
๏ I’m a Mobile Apps Developer & Entrepreneur
๏ CTO & Founder of 7Langit, mobile apps development & agency
๏ Mobile strategist for several startups
๏ Maintain a regular free* class of HTML5 for Mobile Apps
๏ http://about.me/oon
Intro๏ Who wants to develop mobile applications?
๏ What’s the most popular smartphone platform today?
๏ So, what’s the easiest way to develop mobile apps for Android platform?
๏ How about Programming in Java?Or Programming in HTML5 (HTML, CSS, JavaScript)?
the presentation only for
#developers
FILES YOU NEED TO DOWNLOAD
๏ jquery-1.10.2.min.js
๏ jquery.mobile-1.3.2.zip
๏ Java SE 6 (SDK)
๏ apache-ant-1.9.2-bin.zip
๏ Android SDK
๏ phonegap-2.9.0.zip
๏ http://jquery.com/download/
๏ http://jquerymobile.com/download
๏ http://java.sun.com
๏ http://ant.apache.org/bindownload.cgi
๏ http://developer.android.com/sdk/index.html
๏ http://phonegap.com/install
Outline๏ HTML5 at a glance
๏ Mobile site with jQuery Mobile
๏ Android App with HTML5 & PhoneGap
๏ Working with Opensource HTML5 Mobile App Samples (Github)
๏ Connect Mobile App to WebService (JSON)
๏ Going Multiplatforms with PhoneGap Build
HTML5๏ HTML
๏ JavaScript
๏ jQuery, jQuery Mobile
๏ CSS
๏ Wrappers for Mobile platforms
๏ PhoneGap, Sencha, ...
ht tp: / /html5rocks.comhttp: / /www.cocos2d-x.org/wik i /cocos2d-html5
http: / /people.phonegap.comhttp: / /phonegap.com/case/
ht tp: / /devgir l .org
HTML5 MOBILE APPShttp: / /phonegap.com/about/artwork
jQuery Mobilehttp: / /v iew. jquerymobi le.com/1.3.2/dist /demos/
jQuery Mobile Themehttp: / /oo.or. id/ tags/ theme
PHONEGAP๏ unzip phonegap-2.9.0.zip
๏ import Android code from lib/android/example/
๏ build! run! (on device or simulator)
PHONEGAP, TRY TO CUSTOM THE CODE!
๏ edit file index.html
http: / /oo.or. id/content/how-to-get-device- informat ion-phonegap
PHONEGAP, TRY TO CUSTOM THE CODE!
๏ edit file index.js
http: / /oo.or. id/content/how-to-get-device- informat ion-phonegap
PHONEGAP, TRY TO CUSTOM THE CODE!
http: / /oo.or. id/content/how-to-get-device- informat ion-phonegap
PHONEGAP + JQUERY MOBILE
http: / /oo.or. id/content/hel lo- jquery-mobi le
PHONEGAP + JQUERY MOBILE
http: / /oo.or. id/content/hel lo- jquery-mobi le
SAMPLE #1 HALOACI๏ https://github.com/arfiandwi/haloaci
๏ Open Source Music Mobile App forHaloACI: Album Kompilasi 100Musisi Cinta Indonesia
๏ include 8 .m4a songs inhaloaci/assets/www/audio/
ht tp: / /oo.or. id/ tags/ learn-example
SAMPLE #2 JOGJARADIO
https: / /g i thub.com/arf iandwi/ jogjaradio
SAMPLE #3 DOAMUSLIM
https: / /g i thub.com/arf iandwi/doamusl im
WEBSERVICE SAMPLEWORDPRESS JSON-API
๏ Sample data from WordPress site http://boomee.co
๏ Install WordPress plugin JSON-APIhttp://wordpress.org/plugins/json-api/
WEBSERVICE SAMPLEWORDPRESS JSON-API
WEBSERVICE SAMPLEWORDPRESS JSON-API
๏ http://boomee.oo.or.id/api/get_post/?id=1360
WEBSERVICE SAMPLEWORDPRESS JSON-API
MULTIPLATFORM WITH PHONEGAP BUILD
@femaledev @oonid@7langit+femaledev
top related