PhoneGap Setup Task
Your job for this task is to set up PhoneGap on all your machines so that you can build and deploy your HTML5 projects as PhoneGap apps onto an emulator or mobile device.
There is an alternative, called Steroids by Appgyver. It is built on PhoneGap. It has some advantages, but is less mature. I recommend teams use PhoneGap, unless they have a team member who knows Steroids, because there's much more help online for PhoneGap.
PhoneGap is native mobile app code that displays your web app inside a browser object. You only need to customize the code slightly for things like the title of your app. By running the web app inside a native app, the native app can add functions to JavaScript to access the camera, contact list, push notifications , and other device features. PhoneGap provides wrapper apps for iOS (Objective-C), Android (Java), and several other platforms.
The primary advantages of PhoneGap are:
- You can reuse your HTML5 experience and code to make an app with native capabilities.
- The effort needed to adapt the web app portion to different devices is substantially less than that required to port pure native apps.
- You can develop on any platform (but deploying to iOS requires a Mac).
- You can use the same command line tools to compile, build, and deploy apps on Linux, Windows, and MacOS.
- You can use the recently released PhoneGap Developer App to automatically update your app during testing, whenever the app is rebuilt on your development machine.
- You can use PhoneGap Build to build your app on Adobe's servers, generating a QR code testers can use to download the app from their site. You still need to sign the app with your app credentials.
The disadvantages of PhoneGap are:
- You need to install the system development kits (SDKs) for every device you want to build an app for.
- You are limited to the kind of user interface HTML5 can do, and more specifically to the HTML5 supported by the embedded browsers in the web view objects of Android or iOS. These web views are more limited in some ways than the full browsers on the same device.
- As with any app, devices have to download and install updates to get changes.
- To reach a general market, you have to deploy to an app store, which may require waiting for approval.
You are not required to use PhoneGap with your client. If your client only needs a web app, that's fine. If you prefer to do pure native, that's fine. But every team should know how PhoneGap works, what it can do, and what it's limitations are.
Your tasks
Develop a plan
Every team member should have a working copy of PhoneGap and be able to build the final ported app on their device. A a team, you need to develop a plan for getting there.
- Who will set up first, find the pitfalls, and train
the rest? Swarm? Pair?
- Your first client development push comes first.
- Schedule these tasks in the gaps.
- Who will set up for iOS and who for Android?
- What deadlines for each step? These should be short, no more than a day or two for each initial task. Your goal should be to be done within a week.
Install and test PhoneGap
Start at the PhoneGap site. Download and install PhoneGap. Make sure at least one example app works in both the emulator or simulator, and on a real device. Post problems to Piazza.
Alternatively, use PhoneGap Build. This limits you to being online to build and deploy, but has the nice QR code method for deploying to devices. AFAIK, you need to install locally to use PhoneGap Developer App for doing instant updates.
iOS Note: You must have MacOS X Lion (10.7) or greater, and the current version of Xcode 4.5 or greater.
To package an app to be installed on an iOS device, at least one member of your team must have an iOS developer certificate. I will post details on Piazza on how to get an educational account. These accounts expire at the end of this academic year.
Port your app
Create a PhoneGap project for your current team app. Copy over the HTML5 files you have. See what works and what doesn't. Fix. Post problems to Piazza. You can also try the PhoneGap Google Group. It's very active, though to me it seems like it has more questions than answers.
Extend your app (optional)
Extend your app with some functionality made possible by PhoneGap. Two features many clients ask for are:
- in-app picture taking and saving
- push notifications
Do one or both, as a team.
Update your git repos
Your team will probably need to change your app's code to run in PhoneGap. You will definitely need different projects for Android and iOS, one in Java, one in Objective-C. You may need slightly different code for Android and iOS. Be careful how you manage this. Web search for terms like "git phonegap submodules" for some good discussions of how to organize files, e.g., this page .
Document your progress
I've created a Google Doc spreadsheet for each member of each team to document where they're at in the above tasks. Update this as you go.