Cordova Hello World with Android & Eclipse IDE

Why Cordova?

Following are some of the reasons why you would want to use Apache Cordova mobile app development framework. Well, following can be same for other Mobile development framework such as Titanium.

• If you are a web developer and want to deploy a web app that’s packaged for distribution in various app store portals. This is very useful for web developers wanting to distribute their web app as mobile app to different app stores.
• Second common use case is that if you are a mobile developer and want to extend an application across more than one platform, without having to re-implement it with each platform’s language and tool set, Cordova could prove to be helpful.
• Third use case specific to Cordova is that if you are a mobile developer interested in mixing native application components with a WebView (browser window) that can access device-level APIs, Cordova can help a great deal.

Setup Cordova with Android

To work with Cordova, one would require to install Cordova command line interface (CLI). Following are some of the tools one need to install before setting up cordova:

• Install Java and include “bin” folder in the path such as %Java_HOME%\bin.
• Download and install Node.js
• Download and install Git Client
• Download and setup Ant. As part of setup, define ANT_HOME as path variable and include %ANT_HOME%\bin in the path.
• Download and setup Android SDK. Download android SDK from android page. As part of setup, create ANDROID_HOME environment variable and include %ANDROID_HOME%\platform-tools.

I started without last two steps and was unable to get going with Cordova CLI. Once all of the above is done, execute following as per instruction on this cordova page, and you would be done with Hello World. Execute following command to install and setup cordova.

execute npm install -g cordova

Cordova Hello World App with CLI

With Cordova setup done, create a cordova folder and do the following to setup the Hello World app from within that folder.

• Execute the command, “cordova create hello com.example.hello HelloWorld“. Read the instruction on what the command does on following cordova page.
• Goto “hello” folder (cd hello) and execute following command to add Android platform. “cordova platform add android“.
• Execute the build command using “cordova build“. This would generate platform-specific code within the project’s platforms subdirectory.
• That is it. You are all set to test the app in an emulator. Execute “cordova emulate android“.

Setup Cordova Hello World App into Eclipse

I did spend some time to figure out that you would need an IDE to develop with Cordova platform. You could as well use any text editor to work with Cordova platform because what you work with are HTML, CSS and Javascript files. Install Eclipse IDE and do the following steps:

• Create a project
• Import the code generated using cordova CLI into your eclipse
• Start modifying index.html. As this is an HTML page, if you have experience with HTML, CSS and Javascript, write anything and get it shown in the Android emulator.
• Execute “cordova build” and “cordova emulate android” to see the updates on emulator.

[adsenseyu1]