How to create and run your first cordova app

How to create your first cordova app

You are going to create you first app using Cordova so you should below package

--Installation of Node.js

--Installation of Cordova

Following are the step to create Cordova app

Setp 1: Go to the directory where you want to maintain your source code, and create a Cordova project using npm command prompt like below

Syntax: - cordova create [path] [com.example.myapp] [app_name]

Example:-

>npm cordova create hello com.example.hello HelloWorld

Step 2:- Navigate to the folder that you have created for the project and create/add platforms like below

Syntax: - cordova platform add [platform]

Example:-

>npm  cordova platform add android

>npm  cordova platform add ios

Step 3:- add cordova inappbrowser and device plugin

Syntax: - cordova plugin add cordova-plugin-inappbrowser

Example:-

>npm   cordova plugin add cordova-plugin-device

Step 3:- Update the config.xml file in the project root directory.

Step 4:- add this line '<preference name="Orientation" value="landscape" />' before platform tag. (If required)

//add below line to the onDeviceReady function in the index.js file under 'www/js/index.js'.

//5.)     var ref = cordova.InAppBrowser.open('http://www.example.com, '_blank', 'location=no');

Step 5:- Change in the below mentioned files accordingly

            a.) index.css                         (www > css)

            b.) ifm57x57.png   (www > img)

            c.) index.js                (www > js)

            d.) index.html                      (www)

            e.) config.xml

       

Step 6:- build the project

Syntax: - cordova build [platform]

Example:-

>npm   cordova build android

Step 7:-  run the project on the emulator

Syntax: - cordova emulate [platform]

Example:-

>npm cordova emulate android

you can change the logo in the config.xml file

Step 8:-  add this line '<icon src="www/img/example57x57.png" />'

Step 9:-  update the design and view of the index.html page in the www folder

   add this line '<icon src="www/img/ example57x57.png" />'