Docstoc

Intro to PhoneGap - Adobe Groups - PowerPoint

Document Sample
Intro to PhoneGap - Adobe Groups - PowerPoint Powered By Docstoc
					Who Am I?




                   Steve Gill
              PhoneGap Community
                     Champ
            Black Belt in TaeKwonDo
                  Drinks Beer
                 Loves Hockey
                  @SteveSGill
              steveng@adobe.com
What is PhoneGap?
Why Cross-
platform?
Smartphone Platform Market Share




                                           •     90 million
                                                  people in
                                               the US own
                                               smartphone
                                                          s




 Source: comScore MobiLens, October 2011
The Trend: Smartphone Platform Market Share




 Source: comScore MobiLens, October 2011
Convert from Desktop to Mobile
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
Differentiators


•   Runs on more platforms
•   Open community & contributors
•   Web and App with same code
•   Framework and tool support
Supported Platforms


•   iOS (iPad, iPod Touch, iPhone)
•   Android (Everything)
•   BlackBerry (Smartphones, PlayBook)
•   WebOS
•   Symbian
•   Windows Phone
•   Bada
Standards Based




                  +    W3C Device APIs and
                      Policies Working Group
                               (DAP)
APIs


•   Acceleromete   • File
    r              • Geolocatio
•   Camera           n
                   • Media
•   Capture
                   • Network
•   Compass        • Notification
•   Connection     • Storage
•   Contacts
•   Device
•   Events
Basics




         Setup the Viewport

<meta name="viewport" content="width=device-
width, initial-scale=1.0, maximum-scale=1.0, user-
scalable=no;" />
 Basics




Listen for the Device Ready Event
 document.addEventListener("deviceready",
 onDeviceReady,
  false);

 function onDeviceReady(){
 //Do Stuff
 }
Basics


                       Accelerometer
                         Example
function 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);
Plugins


•   Push Notifications (Urban Airship)
•   Child browser
•   Facebook
•   Native Controls

•   Many more, and more coming
Free & Open Source
Tools


•   Emulators
    •   Ripple
    •   Any platform emulator
        (iOS Simulator, Android Virtual Devices, etc)
•   Debugging
    •   Weinre (web inspector remote)
•   IDEs
    •   Eclipse
    •   Dreamweaver
    •   Textmate
Javascript Libraries




                       xui
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
http://build.phonegap.com




                            26
Basics




         DEMO TIME
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
             phonegap.com

             @phonegap

          facebook.com/phonegap




Thanks!

				
DOCUMENT INFO
Shared By:
Categories:
Tags:
Stats:
views:35
posted:7/28/2012
language:
pages:29