Installing PhoneGap

Starting from Apache Cordova 2.0, the installation process and the setting up of your development environment has become much easier. Before the era of 2.0, the installation process of PhoneGap had been confusing because there were a lot of dependencies. These dependencies were due to the fact that, in order to compile an app for different platforms, you not only had to have the platform-specific SDKs but also the platform-specific tools; for example, in order to build for Android, Eclipse, IntelliJ, or Android Studio were required; to build for iOS, Xcode was required; and so on.

You can now use a set of command-line tools shipped with Cordova, which makes it easier to develop cross-platform applications. Installing Cordova and PhoneGap is now as easy as issuing a few commands. Please note that we can use CLI commands related to Cordova or PhoneGap. The PhoneGap CLI offers more added features than its Cordova counterpart such as support for PhoneGap Desktop and Mobile app.

To kick-start the development, let's create a new project. We will use the npm utility Node.js to automatically download the latest framework code.

In the Windows environment, issue the following command:

C:\>npm install -g phonegap

On Linux and OS X, issue the following command:

$ sudo npm install -g phonegap

By using the -g flag in the preceding command, we instruct npm to install PhoneGap globally; otherwise, it will be installed in the current directory. Once the installation process is done, verify the installation by issuing the following command in the command-line terminal. This should return the latest version number of PhoneGap.

phonegap --version

Once we have verified the Cordova installation, we can create a new app project by using the following command:

phonegap create hello

It may take some time for this command to complete. This is the minimal syntax required to create a project where hello is the project name. A new folder named hello will be created in the current working directory. The directory content will be as shown here:

├── hooks
├── merges
├── platforms
├── plugins
├── www
|   └── css
|   └── img
|   └── js
|   └── index.html
├── config.xml

In the www folder, you'll find the HTML/JS/CSS files needed to run the sample PhoneGap app bundled with the binary of the distribution.