Starting Phonegap development: configuration and tools

  • Dec 30, 2013
  • phonegap, mobile

Those familiar with Phonegap development know this awesome service: Adobe PhoneGap Build. It allows building for different platforms without having entire Phonegap infrastructure installed on developer's machine. However, some 'old-school' guys like me, prefer having everthing within reach on local machine. Here are some instructions to get up and running with Phonegap development for Android platform.

Prerequisites

System: Ubuntu 13.10 or Windows 7 or 8

IDE: Eclipse 3.8.1 or IDEA 13

Java: Oracle JDK 1.7.0_45

Download latest JDK from Oracle web site, untar it to destination of choice (I used /opt). Install alternatives like described in this article. Make sure it's working and Oracle JDK is default:

# java -version
java version "1.7.0_45"
Java(TM) SE Runtime Environment (build 1.7.0_45-b18)
Java HotSpot(TM) 64-Bit Server VM (build 24.45-b08, mixed mode)

Android phone

Plug into USB and turn on development mode. For version 4.2 you have to tap About Phone -> Build number several times to activate Developer's menu, like described here. I'm also used CyanogenMod of Android 4.4. Turn on USB Debugging from Developer options.

Software

  • Download and Install ANT, just unzip to destination folder and add it to $PATH variable;
  • Download and install Android Development Kit - in fact you need only unzip it to destination folder. Add [ANDROID_SDK_FOLDER]/sdk/tools and /sdk/platform-tools to your $PATH variable;
  • Download and install node.js - just copy in destination folder and add path to [NODE_JS_FOLDER]/bin to your $PATH variable;
  • Install Phonegap package using Node Package Manager
# npm install -g phonegap
  • Then create Phonegap project. This will create HelloWorld package with default activity of HelloWorld in folder hello:
$ phonegap create hello

or in full form:

$ phonegap create hello com.example.hello HelloWorld

Eclipse

To develop and debug in Eclipse with ADT Plugin, or with ADT Bundle, start new project:

New project -> Android -> Android project from existing code

Point Eclipse to pick up phonegap-generated code. Make sure that both project and library files were picked up by Eclipse.

Then Run As -> Android Application

IDEA

Despite being favorite IDE for Android development at the moment, I've only found handful of instructions for running Phonegap project in IDEA. For time being, I'm editing HTML files from /www folder in IDEA (as Web project) and then sending to be installed to device via this command:

phonegap run android

This command is run from application folder, it will compile and install app on active development device.