Developing a mobile app for Android and iOS with Cordova

16 Oct


Programming a mobile app for different platforms can be now much easier with Apache Cordova. The reason is simple. Cordova is an open-source mobile development framework for developing mobile apps in more than one platform. This avoids you programming in each platform native language using technologies such as JavaScript, HMTL5 and CSS3.

System setup

We will use Linux operating system to deploy our app in a Android device. We need to download and install Eclipse, the ADT plugin and the Android SDK tools. To do that the best option is install the ADT Bundle. After that we can unzip the downloaded file and launch eclipse.

You also have to set up the following environment variables in your .bashrc file in Linux. Make sure include the necessary ones in your PATH environment variable.

export PATH=$PATH:/home/adt-bundle-linux-x86_64-20130917/sdk/tools
export PATH=$PATH:/home/bundle/adt-bundle-linux-x86_64-20130917/sdk/platform-tools
export ANDROID_HOME=/home/adt-bundle-linux-x86_64-20130917/sdk
export ANDROID_BIN=/home/adt-bundle-linux-x86_64-20130917/sdk/tools
export JAVA_HOME=/usr/lib/jvm/java-1.7.0-openjdk-amd64
export ANT_HOME=/usr/share/ant

We also will use Mac operating system to deploy our app in a real iOS device. We have to download and install Xcode tool in this case and launch it.


Installing Cordova Apache

First download Node.js for installing cordova utility later in the operating system you like the most.

sudo npm install -g cordova


Creating the app

Type the following command which will generate a example directory for your project. You also can include a second argument for set a domain and a third argument for name the application’s display text. These two arguments can be edited later in the config.xml file.

cordova create example


Adding the desire platforms

The next step is run the following commands to add an android platform and an ios platform under each operating system. And this is important because Linux doesn’t support iOS platform. After that, run the build command and you will get your specific code for each one.

cd example
cordova platform add android
cordova build android
cordova platform add ios
cordova build ios

We can now open our Android code from Eclipse through File/New Project/Android Project from Existing Code and our iOS code through Open menu.


Developing your app

The important issue here is that unless you want to write specific code for each operating system you can develop your app only modifying the main code. So every time you change the main code in example/www directory you only have to rebuild the app under each platform. And this is a really easy way to develop a app for different platforms.

cordova prepare android
cordova prepare ios
Would like to share? These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • Reddit
  • Facebook
  • Google Bookmarks
  • Ma.gnolia
  • TwitThis
  • LinkedIn

Comment Form