This article is aimed to get you started with Cordova, an open-source mobile development framework, with Eclipse IDE and write your first Android app, Hello World. Read about what is Cordova, how & who should use it on this page.
Following will be detailed in this article:
- Why Cordova?
- Setup Cordova with Android
- Create Cordova Hello World App with command-line interface (CLI)
- Setup Cordova Hello World App into Eclipse
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
- Create a project
- Import the code generated using cordova CLI into your eclipse
- Execute “cordova build” and “cordova emulate android” to see the updates on emulator.