Phonegap

2,140 views
1,837 views

Published on

Published in: Technology, Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
2,140
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
66
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Phonegap

  1. 1. Building Native MobileApplications using PhoneGap Speaker: Essam A. El-Zinaty
  2. 2. Agenda• Mobile Application Overview• PhoneGap Overview• PhoneGap Architecture• PhoneGap UsingGoogle Technology User Group (GTUG)
  3. 3. $ Mobile Applications $http://www.abmuku.com/2011/02/24/technology/american-cell-phone-usage-infographic/ Google Technology User Group (GTUG)
  4. 4. But Google Technology User Group (GTUG)
  5. 5. Lets try web app !Google Technology User Group (GTUG)
  6. 6. OkGoogle Technology User Group (GTUG)
  7. 7. But we are still  No native support NO MONYGoogle Technology User Group (GTUG)
  8. 8. PhoneGapGoogle Technology User Group (GTUG)
  9. 9. So what is PhoneGap Its a tool for building mobile apps using web-tech.Google Technology User Group (GTUG)
  10. 10. How???Google Technology User Group (GTUG)
  11. 11. Native SupportGoogle Technology User Group (GTUG)
  12. 12. Application Structure HTML/JS/CSS + graphic assets are on the device, packaged as part of the build process. JavaScript can store retrieved data in a SQLite database or from localStorage (key/value pair) for offline access. Often a server component involved. JavaScript communicates with the server via XHR to get retrieve data.Google Technology User Group (GTUG)
  13. 13. PhoneGap Architecture Diagram PhoneGap Application Web App PhoneGap Plug-ins HTML JavaScript Accelerometer Geolocation CSS Resources Camera Media Compass Network Contacts Notification PhoneGap JS APIs HTML APIs File Storage HTML Rendering Engine Custom Plug-ins PhoneGap Native (WebView) APIs OS APIs OS APIs Services Sensors Mobile OS Input GraphicsGoogle Technology User Group (GTUG)
  14. 14. Best Practices • Where possible use single HTML page Use JavaScript to show/hide page elements based on user interaction instead of linking to a separate page. Those JavaScript toolkits come in handy here! • Consider offline usage navigator.network.connection.type online /offline events Note: Apple checks for offline supportGoogle Technology User Group (GTUG)
  15. 15. Best Practices • Utilize persistent storage File APIs Storage APIs • SQL Lite / LawnchairWhere possible use single HTML page Use JavaScript to show/hide page elements based on user interaction instead of linking to a separate page. Those JavaScript toolkits come in handy here! • Obfuscate / crunch your JavaScript before releaseGoogle Technology User Group (GTUG)
  16. 16. Using PhoneGap • Create resources in www directory • Include cordova.*.js in your start page (usually index.html) • Create onload handler • In onload handler register for deviceReady event from PhoneGap • When deviceready fires PhoneGap is ready. • Build, install and test for each platform • Use console.log for debugingGoogle Technology User Group (GTUG)
  17. 17. Links • http://docs.phonegap.com/en/1.9.0/guide_getting- started_android_index.md.html#Getting%20Started%20with %20Android • http://docs.phonegap.com/en/1.9.0/index.html • http://brian.io/lawnchair/ • http://zeptojs.com/Google Technology User Group (GTUG)
  18. 18. The End ThanksGoogle Technology User Group (GTUG)

×