Skip to main content

How to Convert Your JavaScript into an Android App using Apache Cordova

Cordova is platform which is used for building mobile phone applications using HTML, CSS and JavaScript. Cordova provides a bridge for link between web app and mobile device.

What is Apache Cordova?

Apache Cordova is an open-source mobile application development framework. It enables you to make use of standard web related technologies for example HTML5, CSS3, and JavaScript for cross-platform development, avoiding each mobile platform native development language.How to Convert Your JavaScript into an Android App using Cordova

Cordova offers one platform for building hybrid mobile phone applications therefore we can develop one app which will be utilized on various mobile platform such as Android, Windows Phone, IOS, Amazon-fireos, blackberry, Firefox OS, Ubuntu and tizien.

How to install Cordova and set up environment:

1. Before start with Cordova setup, its required we need to install the below softwares,
>> NodeJS and NPM
>> Android SDK (Android Environment Setup)
>> XCode (iOS Environment Setup)
>> GIT

2. Open Git CMD (command prompt)
3. To download and install Cordova module, enter the following command on GIT

>npm install -g cordova

To verify the cordova version
 
>cordova -v

How to Convert Your JavaScript into an Android App using Cordova

4. After installation of Cordova, open the directory where do you want to create the app using command prompt and run the following command to create app
>cordova create AndroidProject com.sysadminview.app Sysadminview

AndroidProject – Main directory name
com.sysadminview.app – default reverse domain value
Sysadminview – Title of your appHow to Convert Your JavaScript into an Android App using Cordova
5. Go into the AndroidProject folder
>cd AndroidProject

6. We are developing on windows, we can use the following platforms.
 
>cordova platform add android

How to Convert Your JavaScript into an Android App using Cordova

There are other platforms that can be used on windows OS.
C:\Users\username\Desktop\CordovaProject>cordova platform add wp8
C:\Users\username\Desktop\CordovaProject>cordova platform add amazon-fireos
C:\Users\username\Desktop\CordovaProject>cordova platform add windows
C:\Users\username\Desktop\CordovaProject>cordova platform add blackberry10
C:\Users\username\Desktop\CordovaProject>cordova platform add firefoxos

Developing Apache Cordova on Mac:
$ cordova platform add IOS
$ cordova platform add amazon-fireos
$ cordova platform add android
$ cordova platform add blackberry10
$ cordova platform add firefoxos

To remove platform from your project
>cordova platform rm android

7. Open the AndroidProject folder, platform and android
This is your Android PlatformsHow to Convert Your JavaScript into an Android App using Cordova
8. Open Android Studio, select Import project (Eclipse ADT, Gradle, etc)How to Convert Your JavaScript into an Android App using Cordova
9. Select your folder and click okHow to Convert Your JavaScript into an Android App using Cordova
10. In project, goto assets, www and select index.html
11. Replace/write your javascript in index.htmlHow to Convert Your JavaScript into an Android App using Cordova
12. Click the play button on the tool bar to run the Virtual deviceHow to Convert Your JavaScript into an Android App using Cordova
13. Click Create New Virtual Device and select the deviceHow to Convert Your JavaScript into an Android App using Cordova
14. Android Emulator will open with our applicationHow to Convert Your JavaScript into an Android App using Cordova
We Successfully Convert Your JavaScript/HTML5/CSS into an Android App using Cordova

3 thoughts on “How to Convert Your JavaScript into an Android App using Apache Cordova

  1. I’d like to thank you for the efforts you have put in writing this blog. I really hope to check out the same high-grade content by you in the future as well. In fact, your creative writing abilities has encouraged me to get my own site now 😉

  2. Hey there! I just wish to give you a huge thumbs up for the great info you’ve got right here on this post. I’ll be returning to your blog for more soon.

Leave a Reply

Your email address will not be published. Required fields are marked *