PhoneGap is an open source framework that allows developers to build mobile apps using HTML, CSS, and JavaScript. It works by wrapping web applications in wrappers for each mobile operating system so they can access native device APIs and app stores. Key features include access to device capabilities like the camera, geolocation, contacts and more. It supports building apps for Android, iOS, BlackBerry and other platforms.

1. Introduction to PhoneGap
Raymond Camden

2. Your Speaker
 Developer Evangelist for Adobe
 Focused on Web Standards
 www.raymondcamden.com
 raymondcamden@gmail.com
 @cfjedimaster

3. Wait – Adobe bought PhoneGap?

4. Wait – Adobe bought PhoneGap?

5. Wait – Adobe bought PhoneGap?

6. Adobe bought Nitobi
 We buy all companies with rhyming
names (just because)
 PhoneGap is an open source project
 In process to becoming a project under
the Apache Software Foundation
 New name: Cordova

7. Apache Cordova
 Cordova is the open source project
 PhoneGap is the implemenation
 Like Webkit for Chrome/Safari
 http://incubator.apache.org/cordova

8. What is PhoneGap?
 "PhoneGap is an HTML5 app platform
that allows you to author native
applications with web technologies and
get access to APIs and app stores.
PhoneGap leverages web technologies
developers already know best... HTML
and JavaScript."

9. What is PhoneGap, really?

10. What is PhoneGap, really?
Awesome sauce: http://www.thinkgeek.com/caffeine/dc05/

11. What is PhoneGap, really?

12. Where does it go….
 See the pretty icons below…
 Specific details about each:
◦ http://phonegap.com/about/features
 To be clear: Phones, Tablets, e-Readers,
and whatever else Silicon Valley throws
our way in 2012.

14. Features
 Accelerometer
◦ "The thing you shake"
 Compass
◦ "The thing that tells you what direction you
are heading"
 Device
◦ "Generic info about the device"

15. Features
 Geolocation
◦ "The thing that tells you where you are"
 Storage
◦ "The place you put your stuff"
 Camera
◦ "Pictures of your cat"

16. Features
 Connection
◦ "Am I offline or just in the wrong part of
Lafayette?"
 Events
◦ "What is my phone doing now?!?!"
 Media
◦ "Work with all those legally purchased MP3s."

17. Features
 Capture
◦ "Make new videos, sounds, and pictures of
your cat"
 Contacts
◦ "I really do have 200 friends!"
 File
◦ "For important file stuff"
 Notification
◦ "Buzzzzzzzzzzzzzzzzzz"

18. Features
 Remote Ajax w/o guilt
 Orientation
 The App Store (all of them actually)

19. Who is using PhoneGap?

20. Featured Apps

21. How can you use it? (Tooling)
 Plain text + command line #ubergeek
 Adobe Dreamweaver CS 5.5
 Eclipse
 Xcode
 Other bits for other platforms
 Warning – docs are a bit in flux

22. How can you use it? (Code)
 Add cordova-VERSION.js to your HTML
 Provides the hooks to the awesome
 Done

24. The Hard Way

25. Demo – The Easy Way
http://wiki.phonegap.com/w/page/34483744/PhoneGap%20Eclipse%20PlugIn%20for%20Android

26. Code Demos!
 General Device
 Contact Search
 Compass
 Geolocation
 Camera (oops, broken)
 jQuery Mobile (RSS)
 SimpleDB

27. Plugins

28. Plugins
 Written in your platform's native language
 Provide a JavaScript API
 https://github.com/phonegap/phonegap-
plugins

29. Demo

30. PhoneGap Build
 Public Beta
 Automated builds for all platforms
 API
 http://phonegap.com/2011/10/13/phonega
p-build-pricing-plans-update/

31. Demo

32. Debugging PhoneGap
 Build on the desktop first!
 Consider your development tools
 Weinre
◦ http://phonegap.github.com/weinre/
 debug.phonegap.com

33. Help!
 Mailing List
◦ http://groups.google.com/group/phonegap
 Books
◦ PhoneGap Beginner's Guide
◦ More on Amazon
 IRC

34. Wrap Up
 7 Platforms
 Free
 HTML+JavaScript+CSS
 And you win!