Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.
Introduction to PhoneGap     Mihai Corlan | Web Developer Evangelist | Adobe© 2011 Adobe Systems Incorporated.
About Me  Mihai Corlan      Adobe Web Developer Evangelist      Blog: http://corlan.org      Twitter: mcorlan      Ema...
Agenda      PhoneGap      PhoneGap Build      Debugging PhoneGap Apps© 2011 Adobe Systems Incorporated.
What is PhoneGap?© 2011 Adobe Systems Incorporated.
PhoneGap - Cordova      Is an open source platform for building native mobile applications using       standard web techn...
Why would you use PhoneGap?      Traditional mobile development looks like this:                                         ...
Why would you use PhoneGap?      Traditional mobile development looks like this:                                     Plat...
Why would you use PhoneGap?      What if you want iOS, Android, Symbian, Windows, BlackBerry?© 2011 Adobe Systems Incorpo...
Why would you use PhoneGap?      PhoneGap allows you to use “write once, run everywhere” paradigm      Web standards bas...
PhoneGap supports 7 platforms© 2011 Adobe Systems Incorporated.
PhoneGap could be your best friend                  if      You want to target multiple mobile platforms      You know H...
Demo© 2011 Adobe Systems Incorporated.
How does PhoneGap work?                       PhoneGap App                         Mobile Device      PhoneGap            ...
Built-in device APIs© 2011 Adobe Systems Incorporated.
PhoneGap Plug-ins      http://wiki.phonegap.com/w/page/36752779/PhoneGap%20Plugins      Examples of plugins: https://git...
Building PhoneGap Apps© 2011 Adobe Systems Incorporated.
Build your PhoneGap app as you’d build a regular web app      Using your favorite editors (Eclipse, vim, Dreamweaver)   ...
What can you use to build your application?      Remember your application will run on the device’s browser      You can...
Creating the native installers  There are 2 different methods to build the native installers for your  PhoneGap app:     ...
Using platform native tool chain      Use the OS and tools each platform recommends:           iOS - http://phonegap.com...
Using PhoneGap Build      http://build.phonegap.com - a cloud service      Supports: iOS, Android, BlackBerry, WebOS, Wi...
Resources      Source: github.com/callback      Docs: docs.phonegap.com      Wiki: wiki.phonegap.com      PhoneGap Bui...
Thank You!                                     Question & Answers Time!                 http://corlan.org                 ...
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Prochain SlideShare
Chargement dans…5
×

Introduction to PhoneGap

5 345 vues

Publié le

Introduction to PhoneGap - an open source and cross platform solution for building mobile applications using web standards

Publié dans : Technologie
  • Soyez le premier à commenter

Introduction to PhoneGap

  1. 1. Introduction to PhoneGap Mihai Corlan | Web Developer Evangelist | Adobe© 2011 Adobe Systems Incorporated.
  2. 2. About Me Mihai Corlan  Adobe Web Developer Evangelist  Blog: http://corlan.org  Twitter: mcorlan  Email: mcorlan@adobe.com 2© 2011 Adobe Systems Incorporated.
  3. 3. Agenda  PhoneGap  PhoneGap Build  Debugging PhoneGap Apps© 2011 Adobe Systems Incorporated.
  4. 4. What is PhoneGap?© 2011 Adobe Systems Incorporated.
  5. 5. PhoneGap - Cordova  Is an open source platform for building native mobile applications using standard web technologies (HTML/CSS/JavaScript)  Apache Cordova is the name of the open source project (it is in incubator for now): http://incubator.apache.org/cordova/  PhoneGap is the name of the Adobe’s Cordova distrbution© 2011 Adobe Systems Incorporated.
  6. 6. Why would you use PhoneGap?  Traditional mobile development looks like this: Platform Tools Language Objective-C© 2011 Adobe Systems Incorporated.
  7. 7. Why would you use PhoneGap?  Traditional mobile development looks like this: Platform Platform Tools Language Tools Language Objective-C Java© 2011 Adobe Systems Incorporated.
  8. 8. Why would you use PhoneGap?  What if you want iOS, Android, Symbian, Windows, BlackBerry?© 2011 Adobe Systems Incorporated.
  9. 9. Why would you use PhoneGap?  PhoneGap allows you to use “write once, run everywhere” paradigm  Web standards based & Open Source  You get native installers for each platform ready to be distributed through application stores (App Store, Android Market, …)© 2011 Adobe Systems Incorporated.
  10. 10. PhoneGap supports 7 platforms© 2011 Adobe Systems Incorporated.
  11. 11. PhoneGap could be your best friend if  You want to target multiple mobile platforms  You know HTML/JavaScript/CSS  You already have a web site/web application. Thus you can reuse parts of this (see Wikipedia)© 2011 Adobe Systems Incorporated.
  12. 12. Demo© 2011 Adobe Systems Incorporated.
  13. 13. How does PhoneGap work? PhoneGap App Mobile Device PhoneGap PhoneGap JavaScript Native Engine Engine Access to native mobile Your Code features HTML/JavaScript/CSS/Images/ Frameworks/Libraries Web View Renders the app UI© 2011 Adobe Systems Incorporated.
  14. 14. Built-in device APIs© 2011 Adobe Systems Incorporated.
  15. 15. PhoneGap Plug-ins  http://wiki.phonegap.com/w/page/36752779/PhoneGap%20Plugins  Examples of plugins: https://github.com/purplecabbage/phonegap-plugins  Extend the built-in functionality with custom plug-ins  Delegate heavyweight data processing to native code  Create background services© 2011 Adobe Systems Incorporated.
  16. 16. Building PhoneGap Apps© 2011 Adobe Systems Incorporated.
  17. 17. Build your PhoneGap app as you’d build a regular web app  Using your favorite editors (Eclipse, vim, Dreamweaver)  Test and debug the app using your desktop browser  Test and debug the app using mobile simulators/emulators and the physical devices© 2011 Adobe Systems Incorporated.
  18. 18. What can you use to build your application?  Remember your application will run on the device’s browser  You can use whatever JavaScript frameworks or libraries you like. Eg. jQuery, jQuery Mobile, Sencha, Backbone, Liquid, Mustache, Bootrstrap, and so on  Pay attention to performance (mobile vs. desktop)  Pay attention to mobile browser features or lack of them (I am talking about SVG)© 2011 Adobe Systems Incorporated.
  19. 19. Creating the native installers There are 2 different methods to build the native installers for your PhoneGap app:  Using the target platform tool chain  Using PhoneGap Build – a cloud service© 2011 Adobe Systems Incorporated.
  20. 20. Using platform native tool chain  Use the OS and tools each platform recommends:  iOS - http://phonegap.com/start#ios-x4  Android - http://phonegap.com/start#android  BlackBerry - http://phonegap.com/start#blackberry  Windows Phone - http://phonegap.com/start#wp  WebOS: http://phonegap.com/start#webos  Symbian: http://phonegap.com/start#symbian© 2011 Adobe Systems Incorporated.
  21. 21. Using PhoneGap Build  http://build.phonegap.com - a cloud service  Supports: iOS, Android, BlackBerry, WebOS, Windows Phone 7, and Symbian  Supports one plugin (ChildBrowser); but you can hack in support for other plugins  It is in beta and it is free; it will always be free for Open Source projects  You upload your files (index.html, CSS, JS, images)  Or you provide a Git / SVN link  Support for debugging© 2011 Adobe Systems Incorporated.
  22. 22. Resources  Source: github.com/callback  Docs: docs.phonegap.com  Wiki: wiki.phonegap.com  PhoneGap Build: build.phonegap.com  Plugins: github.com/purplecabbage/phonegap-plugins  Support: groups.google.com/group/phonegap  IRC: irc.freenode.net #phonegap  Apps: phonegap.com/apps  Bugs: issues.apache.org/jira/browse/CB© 2011 Adobe Systems Incorporated.
  23. 23. Thank You! Question & Answers Time! http://corlan.org http://twitter.com/mcorlan http://github.com/mcorlan mcorlan@adobe.com© 2011 Adobe Systems Incorporated.
  24. 24. © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

×