Companions for Phonegap


Phonegap has opened up a whole new way of creating mobile applications, in a nutshell it follows “write once, run anywhere” principle. There are some obvious trade-offs of using phonegap. But once you decide upon this framework, there is still some further RnD required on things like which mobile framework should I choose ? How do I build application for various platforms ? and so on. In this article, I’ll try addressing these issues.

The main problem with JavaScript world is, there are just too many options to choose from. Every other day there comes a new framework claiming it makes development far easier than others. As a result there is nothing like one framework to rule them all. So it ultimately boils down to a soup of frameworks which you have to choose. However just like any other application; JS apps can also broken down to two separate layers of UI and Logic. With this in mind we can now look at various frameworks for mobile development.


UI frameworks
In case of UI, its mostly CSS magic. There are few points should be considered when looking at CSS framework.
  1. Supports CSS3 transitions - CSS3 is the fastest way one can animate in browser
  2. Provides wide range of mobile controls
  3. Supports vector icons
  4. Grid support is a must
  5. Has helper classes for creating common elements such has action bar, tab navigation.
  6. Should be lightweight (in size and complexity of rules)
Also make sure you test on actual device before zeroing down on a framework. Device emulator in chrome doesn’t give you the real picture! In my personal experience I’ve found that many frameworks claim support for all the platforms but do not perform up to the mark when tested on actual devices. If you don’t have a device in mind, then try testing it on as many different devices as possible :)

There is a really nice website I found for comparing mobile frameworks - http://frameworkdemos.com/

Just open this from any mobile browser and start looking how elements are actually rendered on the device.

Backend
Now as for the logic part, most of the UI frameworks give you a way of listening to events. But that’s not enough when we are considering a large application. so for deciding back end logic part of your application there is another great project TodoMVC - http://todomvc.com/. By looking at the code samples, you can get hold of how popular MV* frameworks in JavaScript actually work. Most of the frameworks in this arena are opinionated so in this case there can’t be a thumb-rule for selecting a framework. Just see if it fits your requirements!

Building your application
There is a great tool to build your application for all platforms. https://build.phonegap.com. You can hook up this with a github repository, start the build, download apk and you’re done! Now what if you have to automate this build ? sadly, build phonegap doesn’t support that as of now, at least for the free version. but they have exposed APIs in case you want to fire a build request programmatically. For further reading use https://build.phonegap.com/api

Additions are most welcome :)