Phonegap
Upcoming SlideShare
Loading in...5
×
 

Phonegap

on

  • 1,436 views

 

Statistics

Views

Total Views
1,436
Views on SlideShare
1,436
Embed Views
0

Actions

Likes
0
Downloads
41
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Phonegap Phonegap Presentation Transcript

  • Building Native MobileApplications using PhoneGap Speaker: Essam A. El-Zinaty
  • Agenda• Mobile Application Overview• PhoneGap Overview• PhoneGap Architecture• PhoneGap UsingGoogle Technology User Group (GTUG)
  • $ Mobile Applications $http://www.abmuku.com/2011/02/24/technology/american-cell-phone-usage-infographic/ Google Technology User Group (GTUG)
  • But Google Technology User Group (GTUG)
  • Lets try web app !Google Technology User Group (GTUG)
  • OkGoogle Technology User Group (GTUG)
  • But we are still  No native support NO MONYGoogle Technology User Group (GTUG)
  • PhoneGapGoogle Technology User Group (GTUG)
  • So what is PhoneGap Its a tool for building mobile apps using web-tech.Google Technology User Group (GTUG)
  • How???Google Technology User Group (GTUG)
  • Native SupportGoogle Technology User Group (GTUG)
  • 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)
  • 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)
  • 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)
  • 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)
  • 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)
  • 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)
  • The End ThanksGoogle Technology User Group (GTUG)