Installing PhoneGap/Cordova and Android Studio on Windows

Hello,

I  wanted to develop Hybrid Android App ( Using Javascript  and HTML ) by using phonegap/cordova. I have spent lot of time for installation as there is not complete information about phonegap installation procedure , after searching I came across this article and wanted to published here ,so it will help others.

Install Procedure

ORDER MATTERS

Please follow the installation order as it appears.

• If you encounter issues when editing your path variables, please see this stack overflow post for some good advise as how to prevent this issue.

1. Download JDK- Java SE Development Kit - Windows x64 - (latest edition) and Install using default options
   1. Add a system variable JAVA_HOME and point it to the directory containing the contents of the JDK (example C:\Program Files\Java\jdk1.7.0_51)
   2. Add ;%JAVA_HOME%\bin; to the Path system variable.
   3. If you have a Proxy Server, note proxy server settings and:
      1. Start --> Type Java Control Panel
      2. General Tab --> Click Network Settings...
      3. Choose the appropriate settings, "use browser settings" may work for you.
   4. Validate Java Install:
      1. From a command prompt enter the following

         java -version

      2. You should see something like :

         java version "1.7.0_51"

2. Download Apache Ant and extract to a directory on your computer. (example C:\util\ant\)
   1. Add a system variable ANT_HOME and point it to the directory containing the contents of the ANT directory
   2. Add ;%ANT_HOME%\bin; to the Path system variable.
   3. Validate Ant Install:
      1. From a command prompt enter the following

         ant -version

      2. You should see something like :

         Apache Ant(TM) version 1.9.3 compiled on December 23 2013

      3. Troubleshooting: Unable to locate tools.jar (check to see if JAVA_HOME is set properly)
3. Download Android Studio and Install using default settings.
   1. If you have a Proxy Server, note proxy server settings and open Android Studio:
      1. File --> Settings --> (IDE Settings Section) --> HTTP Proxy
      2. Make the appropriate selection for your environment.
   2. Add a system variable ANDROID_HOME and point it to the directory containing the android sdk that's installed with Android Studio (example: C:\Users\jdoe\AppData\Local\Android\android-studio\sdk)
   3. Add the following to your Path system variable:
      1. ;%ANDROID_HOME%\platform-tools;%ANDROID_HOME%\tools;
4. Download Node and Install (if you already have it installed, download and install again to update it)
   1. Clear your NPM cache (this may save some headaches):

      npm cache clean

   2. If behind a firewall, configure node to speak to the firewall by issuing the following commands:

      npm config set proxy http://domain%5Cusername:password@ipaddress:port

      npm config set https-proxy http://domain%5Cusername:password@ipaddress:port

   3. Validate Node Install:
      1. From a command prompt enter the following

         node --version

      2. You should see something like :

         v0.10.26

   4. Update Node & Global Packages
      1. Update Node:

         npm update -g n

      2. Update Global Packages:

         npm update -g

5. Install Cordova

   npm install -g cordova

Create a New Android Project

1. In a command prompt, Navigate to a folder that will hold the project (example: C:\MobileApps)
2. Create a new project:

   cordova create MyFirstMobileApp com.companyName.MyFirstMobileApp MyFirstMobileApp

3. Navigate to the new project folder:

   cd MyFirstMobileApp

4. Add the Android Platform:

   cordova platform add android

Setup Android Emulator

1. Bring up android config:

   android

2. In the packages tree, in the open Android x.x.x (APIxx) ...
   1. Select Intel x86 Atom System Image
3. In the packages tree, in Extras..
   1. Select Intel x86 Emulator Accelerator (HAXM)
4. Click the Install Packages button
5. Agree to any dialogs that come up.
6. While still in the android config, note the SDK Path, open windows explorer and navigate to that directory.
7. Navigate to extras\intel\Hardware_Accelerated_Execution_Manager and run IntelHaxm.exe
8. While still in the android config, choose tools->manage avds, switch to Device Definitions, select one, Click Create AVD, be sure to choose Intel Atom(x86) for CPU/ABI and in emulation options enable Use Host GPU, choose ok and close out..

Don't Open the project in Android Studio!

1. When pulling from source control, make sure all files are not read only and run clean.bat in platforms\android\cordova and delete any local.properties files in any directories..this may help relieve headaches!!!

Debugging Android Apps

1. Choose to debug using an emulator or on a device attached to the computer:
   1. Start and deploy to the android emulator:

      cordova emulate android

   2. Debug using attached android device:

      cordova run android

2. See cordova android debug output:

   adb start server

   adb devices

   Note : To connect your device to your laptop use USB Cable and

3.  Install http://adbdriver.com/AdbUsb driver .so it will detect your phone.

4. You can use Google Chrome Development tools to remotely inspect and debug javascript running on the device (KitKat +) or in the emulator. This is just wonderful!
   1. Update the java code to enable remote debugging
   2. Start the ADB server:

      adb start-server

   3. Open a new chrome window, enter the following url into the addres bar:

      chrome://inspect#devices

Source : Github