Wednesday, 8 April 2015

ANDROID _APPS_DEVELOPMENT_ USING HTML_CSS_JAVASCRIPT USING PHONEGAP TECHNOLOGY (CORDOVA)

installation of phonegap system Cordova:
-----------------------------step 1-------------------------------------------------------------------------

(1)install node  from http://nodejs.org

to test : node --version

and

Install Git

http://git-scm.com.

---------------------------end of step 1----------------------------------------------------------
--------------------------step 2-----------------------------------------------------------------
(2)install cordova  step by step :

(a)open command prompt:

then type following:

 npm install -g cordova


(b)after installation test :

cordova --version

-------------------------end of step2 -------------------------------------------------------------------------------
--------------------------setp 3--------------------------------------------------------------------------------------------

(3)install ant:


(a)Go to http://ant.apache.org/bindownload.cgi

(b) & download  zip file for Ant & extract  zip file  into

 C:\Program Files\ANT\apache-ant-1.8.4

(c) to test :

ant -version
-----------------------------------end of step3-----------------------------------------------------------------------------

----------------------------------SEt varaible names  step 4------------------------------------------------------------------------------

SEt variable nameS STEP BY STEP:

(a)GO TO FOLLOWING PATH :

FIRST OPEN CONTROL PANEL

(b) then go to Control Panel\All Control Panel Items\System


And follow  the following gudiance  to set variable name:


(a)variable name:ANT_HOME

variable value:C:\Program Files\ant\bin\ant.bat

(b)variable name:

ANDROID_HOME
variable value:D:\om\Android development detials\android-sdk-windows

(c)variable name:JAVA_HOME
variable value:
C:\Program Files (x86)\Java\jdk1.8.0_40

(d)variable name:PATH
variable value:D:\om\Android development detials\android-sdk-windows;C:\USERS\OM\AppData\Roaming\npm;C:\Program Files\ant\bin
-------------------------------------------varibale setting  done--------------------------------------------------------------------------------------------------------
-------------step 5---------installation of eclipse  & Android Sdk for windows----------------------

(a)install eclispe  for java development & android development from   "https://eclipse.org"




(b)install Android Sdk for Windows    from   http://developer.android.com/sdk/index.html#top

there are other download option on this link to download android sdk =http://developer.android.com/sdk/index.html#Other


--------------------------------------------------end of eclispe installtion & Android sdk installation--------------------------------------------------------------------

--------------------------step6----Creating my first apps------------------using html-css-javascript---------------------------------------------------------------------

open  command prompt:

(1) type following command  which will create  a folder under  c:/ drive  myfirstapp:

 cordova create   myfirstapp    com.example.myfirstapp  myfirstaap

(2) To add platform to cordova  type following command to add android platform :

cordova platform add android


(a)then open your folder  myfirstapp :

(i)go to path  C:\myfirstapp\www\index.html

(ii)then open  index.html file :

& replace all code by following code of html:

<!DOCTYPE html>
<html>
 
<head>
     
 <title>Zombie Apocalypse To-Do List</title>
     
<link rel="stylesheet" type="text/css" href="css/index.css"/>
     
<script type="text/javascript" language="JavaScript">

        </script>
 
</head>
    <body>
<h1>hello this is my first apps </h1>

<input type="button" value="Add To-Do"/>

<input type="button" value="Remove Completed Tasks"/>

<br/><br/>
<table id="dataTable" width="100%" border="1">


</table>
 
</body>

</html>

& save it



Now go for next step:

(3)then build  your first app type following command:

cordova build

(4)then  run your apps by typing following apps:

cordova emulate android

-----------------------------------end of step 6---------------------------------------------------------------------------------------------------------------


ouput of my first apps:




No comments:

Post a Comment