Building a Mobile App With jQuery Mobile, Django, and Phonegap

Question

I am currently starting to build a mobile application using jQuery Mobile and wrap it with Phonegap for native app support, it is an extension to our already existing desktop application written in Django, my question, is what is the best way to connect the client side app written in html5/js/css to the server side, would I just use JSON to send/receive data, and does anyone have any good articles on this ?

Answer 1

I personally have created multiple native apps with JqueryMobile as my frontend - Django as the server side - and phonegap to natively wrap into a itunes store application. It's really a great combination of technologies that - if done correctly - can yield a fast native application.

First of all you should look into Tastypie. Tastypie is a really easy way to create an instant RESful API that can send JSON data to javascript/JQuery. Its a Django app and it is very pythonic (plenty of easy class/method overrides - everything is transparent).

The flow of data transfer would look something like this:

1. Use a jquery.ajax function or a getJSON function to get/post/put JSON data from a specified URL.

2. This URL is the tastypie API created from your Models. it could look like /api/vi/blogs/all/

3. Now you have JSON data in your frontend with Jquery - you can do whatever you want with it - fill in a table - work with forms - etc.

First Check out some Jquery/Jquery mobile ajax functions and how to work with JSON on the frontend with the Jquery library. Secondly get familiar with sending JSON back to a Django view (parsing the data and saving it to the database). Then dive into the specifics of JQuery Mobile User Interface and the steps to get it working well with PhoneGap.

Answer 2

One of the things you will need to look out for is same-origin features built into jquery. Since phonegap uses a a webview withl url file:// any web request you make will be cross domain so you need to configure jquery mobile to allow it.

see http://jquerymobile.com/test/docs/pages/phonegap.html

Other than that, there's not much difference between a phonegap mobile application and a regular web app with respect to getting/posting JSON.