Intro to-phone gap-techwed-14dec2011

267 views
254 views

Published on

phonegap technology

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
267
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
7
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Who has heard of PhoneGap? Who has used PhoneGap?
  • feel free to tweet me anything
  • Open source Framework that allows you to build cross platform mobile applications using HTML5, CSS3 and JavaScript.
  • # Problem you discovered / motivation for creating this company * You need expertise in ObjectiveC, Java, .Net, JavaScript, etc... * Resources are expensive and hard to find * Hire internally or an agency both $$$$! * Maintenance * Mobile website?
  • # Problem you discovered / motivation for creating this company * You need expertise in ObjectiveC, Java, .Net, JavaScript, etc... * Resources are expensive and hard to find * Hire internally or an agency both $$$$! * Maintenance * Mobile website?
  • Some of you might be thinking Let me show you one big reason
  • 90 million people. Google has almost half the share, take that ios only devs Never met a single developer who enjoys developing for BB. PhoneGap and webworks making life better Lets see some trends
  • microsoft, nokia + xbox integration will help back on topic
  • Deploy apps to all smartphones Write one HTML5 + JS code base Use existing internal team of web devs Reuse existing code and web services Faster, cheaper development HTML5 and W3C standards compliant
  • Many people using PhoneGap are converting their websites to mobile applications. Lots of reused code.
  • Open Source, Based on open standards, Active and growing community
  • Competitors: Appcelerator, RhoMobile, Corona: They don ’ t do it the same way. We don ’ t do any cross compiling to native code. Just run a web browser instance in a native app and run your web files locally
  • Mac, Windows, anything with a good web browser
  • We model the PhoneGap Api based on the standards defined by w3c, DAP, Mozzila Web API. You guys being web devs have to love that. Nobody wants to go back to the ie6 days
  • Here are some of the API ’ s included with PhoneGap.
  • As a web developer, what do you need to do.
  • Wait for the device to be ready.
  • PhoneGap was submitted to Apache when Nitobi got purchased by Adobe. Currently in incubation phase. Name changed to Callback/Cordova due to legal reasons. This name change only matters to people who actually work on the PhoneGap source code. We will still be calling it PhoneGap in the Community. Source code can currently be found on github. Note: Apache is more about OpenDevelopment than OpenSource.
  • We are going to be making a big push into making better tools available to you guys this upcoming year
  • Any Javascript Framework. Recently jQuery Mobile gaining traction
  • Liquid Layouts Phones get more powerful, performance less of an issue. As secure as your web app. Anyone can view your source. Possibly do server side authentication for sensitive information. Or use a Plugin.
  • Intro to-phone gap-techwed-14dec2011

    1. 1. Who Am I? Steve Gill PhoneGap Community Champ Black Belt in TaeKwonDo Drinks Beer Loves Hockey @SteveSGill steveng@adobe.com
    2. 2. What isPhoneGap?
    3. 3. Why Cross-platform?
    4. 4. Smartphone Platform Market Share • 90 million people in the US own smartphone s Source: comScore MobiLens, October 2011
    5. 5. The Trend: Smartphone Platform Market Share Source: comScore MobiLens, October 2011
    6. 6. Convert from Desktop to Mobile
    7. 7. Benefits• One code base, multiple platforms• Reuse existing web developer skills• Shorter learning curve• Faster development• Mobile site and app with same code• Reusable web code and infrastructure• Code portable to other environments• Based on open standards• Active and growing community• Open source with multiple large stakeholders
    8. 8. Differentiators• Runs on more platforms• Open community & contributors• Web and App with same code• Framework and tool support
    9. 9. Supported Platforms• iOS (iPad, iPod Touch, iPhone)• Android (Everything)• BlackBerry (Smartphones, PlayBook)• WebOS• Symbian• Windows Phone• Bada
    10. 10. Standards Based + W3C Device APIs and Policies Working Group (DAP)
    11. 11. APIs• Accelerometer • File• Camera • Geolocation • Media• Capture • Network• Compass • Notification• Connection • Storage• Contacts• Device• Events
    12. 12. Basics Setup the Viewport<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
    13. 13. BasicsListen for the Device Ready Eventdocument.addEventListener("deviceready", onDeviceReady,false);function onDeviceReady(){//Do Stuff}
    14. 14. Basics Accelerometer Examplefunction onSuccess(acceleration) { alert(Acceleration X: + acceleration.x + n + Acceleration Y: + acceleration.y + n + Acceleration Z: + acceleration.z + n + Timestamp: + acceleration.timestamp + n);};function onError() { alert(onError!);};navigator.accelerometer.getCurrentAcceleration(onSuccess, onError);
    15. 15. Plugins• Push Notifications (Urban Airship)• Child browser• Facebook• Native Controls• Many more, and more coming
    16. 16. Free & Open Source
    17. 17. Tools• Emulators • Ripple • Any platform emulator (iOS Simulator, Android Virtual Devices, etc)• Debugging • Weinre (web inspector remote)• IDEs • Eclipse • Dreamweaver • Textmate
    18. 18. Javascript Libraries xui
    19. 19. Perceived Risks & Concerns• Web tech not appropriate for everything• Many webkits• Many screens/pixel densities• There are bugs!• App store rejections• Not "native"• Performance• Security
    20. 20. http://build.phonegap.com 26
    21. 21. Basics DEMO TIME
    22. 22. Resources• Source: github.com/callback• Bugs: issues.apache.org/jira/browse/CB• Docs: docs.phonegap.com• Wiki: wiki.phonegap.com• Support: groups.google.com/group/phonegap• IRC: irc.freenode.net #phonegap• Apps: phonegap.com/apps
    23. 23. phonegap.com @phonegap facebook.com/phonegapThanks!

    ×