Friday, 10 May 2013

Mobile App using Phonegap

A sample Mobile App using Phonegap

This example talks about creating a Mobile App using Phonegap. I have used this over other tools because it is easy to use and is free as well. As it is built over HTML and jquerymobile it creates rich user interface as well.
Using HTML & jquerymobile as the common centralized code and Phonegap to build the native code around it, it becomes easy to maintain the code as the concerned developer just needs to focus on the HTML code. The rest would be taken care by phonegap to create installables for different mobile platforms like iOS, Android, Windows Phone etc

I have built the application using the following ways
1. Using Phonegap build service at https://build.phonegap.com/apps This just requires you to specify the Git location in the apps section. The build would then create different installables for different mobile platforms with the single common HTML code present inside the www folder.
I have placed an example MobileApp at Github 

2. Using the installation of Phonegap 2.7.0 to local machine.
Follow the steps mentioned in the Phonegap documentation (http://docs.phonegap.com/en/2.7.0/guide_command-line_index.md.html)
Make sure you have the required SDKs installed to run the application on local device. I have created the apps for Android, Windows 7 and Blackberry, which requires the respective SDKs to be installed as a pre-requisite.
Note:
a. While installing the app on Windows Phone (Windows 7) ensure that the windows msbuild executable file runs properly, otherwise you would need to modify the build.js and deploy.js to use C:/Windows/Microsoft.NET/Framework/v4.0.30319/MSBuild.exe
b. And while installing the Blackberry app
    i. make sure the ant-contrib folder is copied from phonegap-2.7.0\lib\blackberry\example\lib\ to phonegap-2.7.0\lib\blackberry\bin\templates\project\lib
    ii. SDK installation somehow does not support names with spaces. So be careful not to keep spaces in the installation location, for eg "C:\Program File", even including the jdk installation.

After the sample apps have been created, replace the www folder inside each of the apps folder with the MobileApp www folder and then execute the application. As a result you have accomplished different installables for single common HTML code







Jersey application with Mongodb

A sample application created using Jersey 1.0.1 and Mongodb 2.4.3.


The first step is to install Mongo DB using the instructions provided at MongoDB site. Mongo DB is one of the noSQL databases that boasts about improving performance when compared to the traditional databases.
To operate with the MongoDB, I used a MonjaDB plugin (http://www.jumperz.net/update/) that can be integrated with eclipse and you will be good to view/update the DB information.

The next step is to create a Jersery application which is essentially a RESTful service that would perform the normal CRUD operations on the Mongo DB. The main components that I would like to highlight are as follows
  1. Resource class (PersonResourceImpl.java) that contains the RESTful methods via find, create, update and delete respectively. This class is annotated as @Component
  2. Service class (PersonServiceImpl.java) that contains the business logic. This class is annotated as @Service
  3. Repository class (PersonRepositoryImpl.java) which has the main DB operations using MongoTemplate. This class is annotated as @Repository
  4. POJO class (Person.java) that is used as a data object and has two annotations @Document (to store as an object in MongoDB) and @XmlRootElement (for marshalling/unmarshalling JSON/XML response)
  5. web.xml:  The servlet class used here is "com.sun.jersey.spi.spring.container.servlet.SpringServlet". Most of the examples had "com.sun.jersey.spi.container.servlet.ServletContainer" but this required explicit mentioning of the package in which Resource class resides in. But SpringServlet does not need it as it automatically scans and loads the Resource class.Also the explicit marshalling/unmarshalling was not required to convert the response to JSON/XML which most of the examples did by using "com.sun.jersey.api.json.POJOMappingFeature".  
  6.  <servlet>
         <servlet-name>JerseyWebApplication</servlet-name>
         <servlet-class>com.sun.jersey.spi.spring.container.servlet.SpringServlet</servlet-class>
     </servlet>
    
  7. applicationContext.xml: This contains the MongoTemplate definition which handles the connectivity with MongoDB. Here you can see that there is no specific db configuration required unlike other traditional databases which requires explicit mentioning of the driver, url etc. Only the database name "demo" is specified. Also there is no explicit definition of the Resource, Service and Repository classes as they are self annotated.
  8.   <bean id="mongoTemplate" class="org.springframework.data.mongodb.core.MongoTemplate">
        <constructor-arg name="mongo" ref="mongo"/>
        <constructor-arg name="databaseName" value="demo"/>
      </bean>
    
The complete source could can be found at Github