Dave Johnson speaks about PhoneGap and how to use it with Facebook.

1. What’s PhoneGap
Why’s it Awesome
How to use it w/ Facebook

3. PhoneGap === Cordova
http://github.com/apache/incubator-cordova-*

4. PhoneGap Pattern
1. Embed a chromeless browser in a native app
2. Create a “bridge” between the browser and the native code
providing access to native APIs
3. Write a web app
4. Package the web app with the native code and deploy to devices!

6. Write once debug everywhere

9. Take note
• HTML, JS, CSS etc included in app package
• HTML loaded on file:// URI scheme, no cross domain request
restrictions
• Engineering wise, approach is simple to extend to new
platforms

10. Supported Platforms
iOS >= 3.2
Android >= 1.5
BlackBerry >= 4.6
webOS >= 1.4.5
Symbian >= 1
Windows Phone >= 7.5
Samsung Bada = 1

11. MIT/BSD/APACHE

12. Community

13. Contributors
PhoneGap
-- ohloh.net

14. Trends
PhoneGap

15. Community Stuff
800,000 30,000 40+ 50+ 800,000
downloads messages tools contributors visits/month

16. Contributors
• Adobe
• IBM
• Microsoft
• RIM
• HP/Palm
• Salesforce.com

17. Thousands of Apps

18. Users
• Alcatel-Lucent
• Zynga
• Microsoft
• Travelocity
• Vodafone
• Wikipedia

19. Traction
• ~15,000 PhoneGap apps in the App Store
• Most popular categories?
• medical
• news
• business

20. Governance

21. PhoneGap === Cordova
http://github.com/apache/incubator-cordova-*

23. Mobile first!

24. HTML(5)

25. HTML(5)

26. Setup the Viewport

27. CSS3
-webkit-transform:
translate3d(x,y,z) scale3D(1,1,1.0)

28. CSS Media Queries

29. Media Values
• all
• max-device-width: 480px
• min-device-width: 481px
• orientation: portrait
• -webkit-min-device-pixel-ration: 2

30. General Tricks
• window.devicePixelRatio

31. Startup

34. The Future
• Tooling
• WebGL
• Facebook / LinkedIn / Walmart use case
• Continue polyfilling HTML5

35. PhoneGap APIs
• Sensors
• Data
• Events
http://docs.phonegap.com

36. Tooling
• Use any IDE
• Use the platform emulators (at your peril)
• Use Ripple emulator
• Use Web Inspector Remote (Weinre)
• Console.log and alert =(

37. Libraries
• DOM
• Testing
• Style / GUI
• Persistence

38. Plugins

39. How aboot some code?

40. http://tiny.cc/pg-fb

41. project resources
phonegap.com
docs.phonegap.com
wiki.phonegap.com
github.com/callback
groups.google.com/group/phonegap
#phonegap on freenode
@phonegap
@davejohnson
thanks!