Blog Archives

PhoneGap is a free open source framework that allows us to create mobile apps using standard web technologies such as HTML, CSS, and JavaScript (http://phonegap.com).

If you follow the steps in the web page, Install PhoneGap (http://phonegap.com/install/), most likely you would get stuck in the second or third step. This is because the documentation is horrible and gives us a lot of confusions.

Earlier versions of PhoneGap were tightly integrated into Eclipse and Xcode. But it is obvious that PhoneGap stops catching up new updates of various platform. It seems that they went back to command line tools with poor quality documentations.

It makes me think that the only reason why Adobe purchased this company was just to kill this product.

Anyway, let us get started. To install 3.3 version of PhoneGap, Node.JS is required.

1. Install Node.JS

Go to http://nodejs.org and find the INSTALL button. Click it to install. This step is very straightforward and easy thanks to the node.js install program.

2. Install PhoneGap

Open “Terminal” and run the following.

$ sudo npm install -g phonegap

phonegap is a command line tool. You will be able to use “phone gap” command to create a project. But you will NOT be able to build or run the app in any platform.

3. Create a Project

$ phonegap create my-app
$ cd my-app

This will create a phone gap project but it doesn’t include any platform dependent modules.

4. Install Cordova

There are buzzes regarding to PhoneGap, Cordova, and their relationship. Here is a clarification from PhoneGap Blog. http://phonegap.com/2012/03/19/phonegap-cordova-and-what’s-in-a-name/

To make the long story short,

PhoneGap is a distribution of Apache Cordova. You can think of Apache Cordova as the engine that powers PhoneGap, similar to how WebKit is the engine that powers Chrome or Safari.

And,

If your goal is to build cross platform apps with HTML, JS and CSS then keep on using PhoneGap for everything you need. This isn’t to say the transition has been perfect. We messed up the last release by not correctly updating the documentation to reflect the name change which confused new users.

The conclusion is that we NEED cordova installation along with PhoneGap. Very weird. Right? Anyway use the following command.

$ sudo npm install -g cordova

5. Add Platforms to a Project

The folder “platforms” inside “my-app” (the newly created project folder) has nothing from your creation. We have to add platforms (such as android and iOS). This is the moment where we have to use cordova. Let’s add the iOS platform that means cordova creates all necessary files to be a proper project for Xcode.

$ cordova platform add ios

Next let’s add the android platform.

$ cordova platform add android

You will see an error saying that ‘ant’ is not installed if you have installed it already in your system. Also I assume that you do not have MacPorts as well just like me. Let’s use “homebrew” to install “ant.”