SlideShare une entreprise Scribd logo
1  sur  29
Télécharger pour lire hors ligne
Intro to-phone gap-techwed-14dec2011
Who Am I?




                     Steve Gill
            PhoneGap Community Champ
              Black Belt in TaeKwonDo
                    Drinks Beer
                   Loves Hockey
                    @SteveSGill
                steveng@adobe.com
What is
PhoneGap?
Intro to-phone gap-techwed-14dec2011
Intro to-phone gap-techwed-14dec2011
Intro to-phone gap-techwed-14dec2011
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
Intro to-phone gap-techwed-14dec2011
Intro to-phone gap-techwed-14dec2011
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


• Accelerometer   •   File
• Camera          •   Geolocation
                  •   Media
• Capture
                  •   Network
• Compass
                  •   Notification
• Connection      •   Storage
• Contacts
• Device
• Events
Basics




         Setup the Viewport

<meta name="viewport" content="width=devic
e-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!

Contenu connexe

En vedette

Multimedia student tutorial stacey leeth
Multimedia student tutorial stacey leethMultimedia student tutorial stacey leeth
Multimedia student tutorial stacey leethlaskowski07
 
An introduction to addition final version
An introduction to addition final versionAn introduction to addition final version
An introduction to addition final versionlaskowski07
 
Business Continuity Planning
Business Continuity PlanningBusiness Continuity Planning
Business Continuity PlanningPete DiSantis
 
Coke Worldcup Screenings - Nationally
Coke Worldcup Screenings - NationallyCoke Worldcup Screenings - Nationally
Coke Worldcup Screenings - NationallyMilon Kumar Biswas
 
Multiplication, part 2
Multiplication, part 2Multiplication, part 2
Multiplication, part 2laskowski07
 
Multiplication, part 1
Multiplication, part 1Multiplication, part 1
Multiplication, part 1laskowski07
 
Social calming tech
Social calming techSocial calming tech
Social calming techyiyin7
 
Digital divide pp
Digital divide ppDigital divide pp
Digital divide ppTechined
 
Le parole della lim presentazione del 2° incontro
Le parole della lim   presentazione del 2° incontroLe parole della lim   presentazione del 2° incontro
Le parole della lim presentazione del 2° incontropierky
 
Le parole della lim presentazione del 2° incontro
Le parole della lim   presentazione del 2° incontroLe parole della lim   presentazione del 2° incontro
Le parole della lim presentazione del 2° incontropierky
 
Cos’è la lim presentazione 1° incontro
Cos’è la lim   presentazione 1° incontroCos’è la lim   presentazione 1° incontro
Cos’è la lim presentazione 1° incontropierky
 

En vedette (17)

Introduction scrum
Introduction scrumIntroduction scrum
Introduction scrum
 
Division
DivisionDivision
Division
 
Multimedia student tutorial stacey leeth
Multimedia student tutorial stacey leethMultimedia student tutorial stacey leeth
Multimedia student tutorial stacey leeth
 
An introduction to addition final version
An introduction to addition final versionAn introduction to addition final version
An introduction to addition final version
 
Be a hero today
Be a hero todayBe a hero today
Be a hero today
 
Business Continuity Planning
Business Continuity PlanningBusiness Continuity Planning
Business Continuity Planning
 
Coke Worldcup Screenings - Nationally
Coke Worldcup Screenings - NationallyCoke Worldcup Screenings - Nationally
Coke Worldcup Screenings - Nationally
 
Multiplication, part 2
Multiplication, part 2Multiplication, part 2
Multiplication, part 2
 
Module2 539gcu
Module2 539gcuModule2 539gcu
Module2 539gcu
 
Multiplication, part 1
Multiplication, part 1Multiplication, part 1
Multiplication, part 1
 
Social calming tech
Social calming techSocial calming tech
Social calming tech
 
Digital divide pp
Digital divide ppDigital divide pp
Digital divide pp
 
Le parole della lim presentazione del 2° incontro
Le parole della lim   presentazione del 2° incontroLe parole della lim   presentazione del 2° incontro
Le parole della lim presentazione del 2° incontro
 
Le parole della lim presentazione del 2° incontro
Le parole della lim   presentazione del 2° incontroLe parole della lim   presentazione del 2° incontro
Le parole della lim presentazione del 2° incontro
 
Cos’è la lim presentazione 1° incontro
Cos’è la lim   presentazione 1° incontroCos’è la lim   presentazione 1° incontro
Cos’è la lim presentazione 1° incontro
 
Piano power point
Piano power pointPiano power point
Piano power point
 
Maslow
MaslowMaslow
Maslow
 

Similaire à Intro to-phone gap-techwed-14dec2011

PhoneGap Slides from HTML5 Next and Now
PhoneGap Slides from HTML5 Next and NowPhoneGap Slides from HTML5 Next and Now
PhoneGap Slides from HTML5 Next and NowSteve Gill
 
HTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There TodayHTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There Todaydavyjones
 
Phonegap facebook plugin - Seoul & Tokyo
Phonegap facebook plugin - Seoul & TokyoPhonegap facebook plugin - Seoul & Tokyo
Phonegap facebook plugin - Seoul & TokyoSteve Gill
 
Philly ete-2011
Philly ete-2011Philly ete-2011
Philly ete-2011davyjones
 
PhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile HackPhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile HackPhoneGap
 
PhoneGap talk from Singapore
PhoneGap talk from SingaporePhoneGap talk from Singapore
PhoneGap talk from SingaporeSteve Gill
 
Phonegap facebook- plugin
Phonegap facebook- pluginPhonegap facebook- plugin
Phonegap facebook- pluginSteve Gill
 
The Mobile Web Revealed For The Java Developer
The Mobile Web Revealed For The Java DeveloperThe Mobile Web Revealed For The Java Developer
The Mobile Web Revealed For The Java Developerbalunasj
 
Android development workshop
Android development workshopAndroid development workshop
Android development workshopJeff Sonstein
 
Tech trends - Get some of these skills to stay current
Tech trends - Get some of these skills to stay currentTech trends - Get some of these skills to stay current
Tech trends - Get some of these skills to stay currentSandeep Bhatnagar
 
PhoneGap - Now and the Future
PhoneGap - Now and the FuturePhoneGap - Now and the Future
PhoneGap - Now and the FutureTim Kim
 
移动端Web app开发
移动端Web app开发移动端Web app开发
移动端Web app开发Zhang Xiaoxue
 
Cross-platform App with PhoneGap - Henri Mägi
Cross-platform App with PhoneGap - Henri MägiCross-platform App with PhoneGap - Henri Mägi
Cross-platform App with PhoneGap - Henri MägiMobileMonday Estonia
 
Developing Windows Phone 8 apps using PhoneGap
Developing Windows Phone 8 apps using PhoneGapDeveloping Windows Phone 8 apps using PhoneGap
Developing Windows Phone 8 apps using PhoneGapAmar Mesic
 
Mobeers waterloo-2011
Mobeers waterloo-2011Mobeers waterloo-2011
Mobeers waterloo-2011Brian LeRoux
 
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)Ryan Cuprak
 
HTML5 or Android for Mobile Development?
HTML5 or Android for Mobile Development?HTML5 or Android for Mobile Development?
HTML5 or Android for Mobile Development?Reto Meier
 
Hybrid application development
Hybrid application developmentHybrid application development
Hybrid application developmentEngin Hatay
 

Similaire à Intro to-phone gap-techwed-14dec2011 (20)

PhoneGap Slides from HTML5 Next and Now
PhoneGap Slides from HTML5 Next and NowPhoneGap Slides from HTML5 Next and Now
PhoneGap Slides from HTML5 Next and Now
 
HTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There TodayHTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There Today
 
Phonegap facebook plugin - Seoul & Tokyo
Phonegap facebook plugin - Seoul & TokyoPhonegap facebook plugin - Seoul & Tokyo
Phonegap facebook plugin - Seoul & Tokyo
 
Philly ete-2011
Philly ete-2011Philly ete-2011
Philly ete-2011
 
PhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile HackPhoneGap at Facebook Mobile Hack
PhoneGap at Facebook Mobile Hack
 
Future of Mobile
Future of MobileFuture of Mobile
Future of Mobile
 
PhoneGap talk from Singapore
PhoneGap talk from SingaporePhoneGap talk from Singapore
PhoneGap talk from Singapore
 
Phonegap facebook- plugin
Phonegap facebook- pluginPhonegap facebook- plugin
Phonegap facebook- plugin
 
The Mobile Web Revealed For The Java Developer
The Mobile Web Revealed For The Java DeveloperThe Mobile Web Revealed For The Java Developer
The Mobile Web Revealed For The Java Developer
 
Android development workshop
Android development workshopAndroid development workshop
Android development workshop
 
Tech trends - Get some of these skills to stay current
Tech trends - Get some of these skills to stay currentTech trends - Get some of these skills to stay current
Tech trends - Get some of these skills to stay current
 
PhoneGap - Now and the Future
PhoneGap - Now and the FuturePhoneGap - Now and the Future
PhoneGap - Now and the Future
 
移动端Web app开发
移动端Web app开发移动端Web app开发
移动端Web app开发
 
Cross-platform App with PhoneGap - Henri Mägi
Cross-platform App with PhoneGap - Henri MägiCross-platform App with PhoneGap - Henri Mägi
Cross-platform App with PhoneGap - Henri Mägi
 
Developing Windows Phone 8 apps using PhoneGap
Developing Windows Phone 8 apps using PhoneGapDeveloping Windows Phone 8 apps using PhoneGap
Developing Windows Phone 8 apps using PhoneGap
 
Mobeers waterloo-2011
Mobeers waterloo-2011Mobeers waterloo-2011
Mobeers waterloo-2011
 
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)
Hybrid Mobile Development with Apache Cordova and Java EE 7 (JavaOne 2014)
 
HTML5 or Android for Mobile Development?
HTML5 or Android for Mobile Development?HTML5 or Android for Mobile Development?
HTML5 or Android for Mobile Development?
 
Phone gap
Phone gapPhone gap
Phone gap
 
Hybrid application development
Hybrid application developmentHybrid application development
Hybrid application development
 

Dernier

Presentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a ParagraphPresentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a ParagraphNetziValdelomar1
 
Diploma in Nursing Admission Test Question Solution 2023.pdf
Diploma in Nursing Admission Test Question Solution 2023.pdfDiploma in Nursing Admission Test Question Solution 2023.pdf
Diploma in Nursing Admission Test Question Solution 2023.pdfMohonDas
 
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...Nguyen Thanh Tu Collection
 
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptx
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptxPISA-VET launch_El Iza Mohamedou_19 March 2024.pptx
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptxEduSkills OECD
 
The Singapore Teaching Practice document
The Singapore Teaching Practice documentThe Singapore Teaching Practice document
The Singapore Teaching Practice documentXsasf Sfdfasd
 
Quality Assurance_GOOD LABORATORY PRACTICE
Quality Assurance_GOOD LABORATORY PRACTICEQuality Assurance_GOOD LABORATORY PRACTICE
Quality Assurance_GOOD LABORATORY PRACTICESayali Powar
 
Maximizing Impact_ Nonprofit Website Planning, Budgeting, and Design.pdf
Maximizing Impact_ Nonprofit Website Planning, Budgeting, and Design.pdfMaximizing Impact_ Nonprofit Website Planning, Budgeting, and Design.pdf
Maximizing Impact_ Nonprofit Website Planning, Budgeting, and Design.pdfTechSoup
 
HED Office Sohayok Exam Question Solution 2023.pdf
HED Office Sohayok Exam Question Solution 2023.pdfHED Office Sohayok Exam Question Solution 2023.pdf
HED Office Sohayok Exam Question Solution 2023.pdfMohonDas
 
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptxPractical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptxKatherine Villaluna
 
What is the Future of QuickBooks DeskTop?
What is the Future of QuickBooks DeskTop?What is the Future of QuickBooks DeskTop?
What is the Future of QuickBooks DeskTop?TechSoup
 
In - Vivo and In - Vitro Correlation.pptx
In - Vivo and In - Vitro Correlation.pptxIn - Vivo and In - Vitro Correlation.pptx
In - Vivo and In - Vitro Correlation.pptxAditiChauhan701637
 
Education and training program in the hospital APR.pptx
Education and training program in the hospital APR.pptxEducation and training program in the hospital APR.pptx
Education and training program in the hospital APR.pptxraviapr7
 
Drug Information Services- DIC and Sources.
Drug Information Services- DIC and Sources.Drug Information Services- DIC and Sources.
Drug Information Services- DIC and Sources.raviapr7
 
Ultra structure and life cycle of Plasmodium.pptx
Ultra structure and life cycle of Plasmodium.pptxUltra structure and life cycle of Plasmodium.pptx
Ultra structure and life cycle of Plasmodium.pptxDr. Asif Anas
 
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptxSandy Millin
 
How to Make a Field read-only in Odoo 17
How to Make a Field read-only in Odoo 17How to Make a Field read-only in Odoo 17
How to Make a Field read-only in Odoo 17Celine George
 
CapTechU Doctoral Presentation -March 2024 slides.pptx
CapTechU Doctoral Presentation -March 2024 slides.pptxCapTechU Doctoral Presentation -March 2024 slides.pptx
CapTechU Doctoral Presentation -March 2024 slides.pptxCapitolTechU
 
How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17Celine George
 
How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17Celine George
 

Dernier (20)

Personal Resilience in Project Management 2 - TV Edit 1a.pdf
Personal Resilience in Project Management 2 - TV Edit 1a.pdfPersonal Resilience in Project Management 2 - TV Edit 1a.pdf
Personal Resilience in Project Management 2 - TV Edit 1a.pdf
 
Presentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a ParagraphPresentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a Paragraph
 
Diploma in Nursing Admission Test Question Solution 2023.pdf
Diploma in Nursing Admission Test Question Solution 2023.pdfDiploma in Nursing Admission Test Question Solution 2023.pdf
Diploma in Nursing Admission Test Question Solution 2023.pdf
 
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...
 
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptx
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptxPISA-VET launch_El Iza Mohamedou_19 March 2024.pptx
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptx
 
The Singapore Teaching Practice document
The Singapore Teaching Practice documentThe Singapore Teaching Practice document
The Singapore Teaching Practice document
 
Quality Assurance_GOOD LABORATORY PRACTICE
Quality Assurance_GOOD LABORATORY PRACTICEQuality Assurance_GOOD LABORATORY PRACTICE
Quality Assurance_GOOD LABORATORY PRACTICE
 
Maximizing Impact_ Nonprofit Website Planning, Budgeting, and Design.pdf
Maximizing Impact_ Nonprofit Website Planning, Budgeting, and Design.pdfMaximizing Impact_ Nonprofit Website Planning, Budgeting, and Design.pdf
Maximizing Impact_ Nonprofit Website Planning, Budgeting, and Design.pdf
 
HED Office Sohayok Exam Question Solution 2023.pdf
HED Office Sohayok Exam Question Solution 2023.pdfHED Office Sohayok Exam Question Solution 2023.pdf
HED Office Sohayok Exam Question Solution 2023.pdf
 
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptxPractical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptx
 
What is the Future of QuickBooks DeskTop?
What is the Future of QuickBooks DeskTop?What is the Future of QuickBooks DeskTop?
What is the Future of QuickBooks DeskTop?
 
In - Vivo and In - Vitro Correlation.pptx
In - Vivo and In - Vitro Correlation.pptxIn - Vivo and In - Vitro Correlation.pptx
In - Vivo and In - Vitro Correlation.pptx
 
Education and training program in the hospital APR.pptx
Education and training program in the hospital APR.pptxEducation and training program in the hospital APR.pptx
Education and training program in the hospital APR.pptx
 
Drug Information Services- DIC and Sources.
Drug Information Services- DIC and Sources.Drug Information Services- DIC and Sources.
Drug Information Services- DIC and Sources.
 
Ultra structure and life cycle of Plasmodium.pptx
Ultra structure and life cycle of Plasmodium.pptxUltra structure and life cycle of Plasmodium.pptx
Ultra structure and life cycle of Plasmodium.pptx
 
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx
2024.03.23 What do successful readers do - Sandy Millin for PARK.pptx
 
How to Make a Field read-only in Odoo 17
How to Make a Field read-only in Odoo 17How to Make a Field read-only in Odoo 17
How to Make a Field read-only in Odoo 17
 
CapTechU Doctoral Presentation -March 2024 slides.pptx
CapTechU Doctoral Presentation -March 2024 slides.pptxCapTechU Doctoral Presentation -March 2024 slides.pptx
CapTechU Doctoral Presentation -March 2024 slides.pptx
 
How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17
 
How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17
 

Intro to-phone gap-techwed-14dec2011

  • 2. Who Am I? Steve Gill PhoneGap Community Champ Black Belt in TaeKwonDo Drinks Beer Loves Hockey @SteveSGill steveng@adobe.com
  • 8. Smartphone Platform Market Share • 90 million people in the US own smartphone s Source: comScore MobiLens, October 2011
  • 9. The Trend: Smartphone Platform Market Share Source: comScore MobiLens, October 2011
  • 12. Convert from Desktop to Mobile
  • 13. 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
  • 14. Differentiators • Runs on more platforms • Open community & contributors • Web and App with same code • Framework and tool support
  • 15. Supported Platforms • iOS (iPad, iPod Touch, iPhone) • Android (Everything) • BlackBerry (Smartphones, PlayBook) • WebOS • Symbian • Windows Phone • Bada
  • 16. Standards Based + W3C Device APIs and Policies Working Group (DAP)
  • 17. APIs • Accelerometer • File • Camera • Geolocation • Media • Capture • Network • Compass • Notification • Connection • Storage • Contacts • Device • Events
  • 18. Basics Setup the Viewport <meta name="viewport" content="width=devic e-width, initial-scale=1.0, maximum- scale=1.0, user-scalable=no;" />
  • 19. Basics Listen for the Device Ready Event document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady(){ //Do Stuff }
  • 20. 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);
  • 21. Plugins • Push Notifications (Urban Airship) • Child browser • Facebook • Native Controls • Many more, and more coming
  • 22. Free & Open Source
  • 23. Tools • Emulators • Ripple • Any platform emulator (iOS Simulator, Android Virtual Devices, etc) • Debugging • Weinre (web inspector remote) • IDEs • Eclipse • Dreamweaver • Textmate
  • 25. 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
  • 27. Basics DEMO TIME
  • 28. 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
  • 29. phonegap.com @phonegap facebook.com/phonegap Thanks!

Notes de l'éditeur

  1. Who has heard of PhoneGap? Who has used PhoneGap?
  2. feel free to tweet me anything
  3. Open source Framework that allows you to build cross platform mobile applications using HTML5, CSS3 and JavaScript.
  4. # 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?
  5. # 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?
  6. Some of you might be thinking Let me show you one big reason
  7. 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
  8. microsoft, nokia + xbox integration will help back on topic
  9. 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
  10. Many people using PhoneGap are converting their websites to mobile applications. Lots of reused code.
  11. Open Source, Based on open standards, Active and growing community
  12. 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
  13. Mac, Windows, anything with a good web browser
  14. 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
  15. Here are some of the API ’ s included with PhoneGap.
  16. As a web developer, what do you need to do.
  17. Wait for the device to be ready.
  18. 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.
  19. We are going to be making a big push into making better tools available to you guys this upcoming year
  20. Any Javascript Framework. Recently jQuery Mobile gaining traction
  21. 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.