Retool your HTML/JavaScript to go Mobile @atdebonis 2008 Troy Web Consulting LLC All rights reserved 1
Overview What is PhoneGap? What is it good for? What can you use with it? Device Features Dev Tools Debugging OpenSource Details 2
What is PhoneGap? Application container that allows you to build natively installed apps using HTML, CSS & JavaScript One Codebase and deploy to Android Blackberry ipad iphone Sybmian Windows Mobile Free and OpenSource to use Download for free at www.phonegap.com 3
What is it good for? Business Applications Forms Information Charts/Data Visualization Some basic games Demo out Li Doodle Games that don t require access to GPU (Graphics Processing Unit) 4
Demo New Mobile app to ipad 5
What can you use with it? Build app UI using HTML & CSS Build app logic & interactivity with JavaScript Use the PhoneGap API to interact with device Jquery JqueryMobile Sencha Touch (2) Backbone.js Dojo most any JS Library 6
Device Features You Can Access Device Info (Name, UUID, Platform, Version) Network Connection Info / State Accelerometer Compass Geolocation Camera Media File System / Storage / SqlLite DB Contacts Trigger Phone Calls Send TXT Message Notifications 7
Demo TW Base Mobile Application 8
Dev Tools Tools NotePad, TextEdit, vi Xcode Apples Development Tools Adobe Dreamweaver Eclipse Cloud Build Service Build.phonegap.com > if you do not have a Mac Free / Just Aquired and will be adding more features $ Deployment itunes itunes Connect for Live Production apps Test Flight App deploy to ios devices Drop Box for Android apps 9
Debugging Chrome Developer Tools Is Web-kit so its required IF you use Sencha Touch To tell Chrome to allow for unrestricted access from the file system, and will also allow cross-site requests. open -a /Applications/Google\ Chrome.app --args --allow-file-access-from-files -- disable-web-security FireBug plug-in to FireFox Remote Debug with weinre 10
OpenSource PhoneGap is 100% open source? PhoneGap is the commercial name for Apache Cordova. PhoneGap/Cordova was contributed to Apache Software Foundation by Adobe. You can get involved today! http://incubator.apache.org/cordova/ 11
Native Extensions Out of the box, PhoneGap provides APIs for Accelerometer, Camera, Compass, Media, FileSystem, etc Want more leverage existing Extensions or Write your own Android IOS 12
References www.phonegap.com wiki.phonegap.com Build.phonegap.com Testflightapp.com http://www.tricedesigns.com/wp-content/uploads/2012/02/intro-to- PhoneGap1.pdf 13