Home » PhoneGap » PhoneGap Developer App
PhoneGap

PhoneGap Developer App

In our previous post I demonstrated how to install PhoneGap, create your first project, and compile and run it on an Android device. Continuing a series of PhoneGap posts, I’m going to demonstrate the most useful PhoneGap tool at your disposal; the PhoneGap Developer App.

What is the PhoneGap Developer App?

PhoneGap Developer App allows you to develop locally and then see the changes on your mobile device instantly. There is no need to re-sign, re-compile, and reinstall your app on a mobile device just to test your code. It even provides access to the device APIs that you can’t test in a web browser.

Downloading the mobile app

The PhoneGap Developer App is available on Android, iOS, and Windows Phone. Download the app to your mobile devices to get started.

The Android version is available in the Google Play Store. It requires Android 4.1+.

The iOS version is available in the App Store. It requires iOS 6.0 or later.

The Windows Phone version is available in the Windows Phone Store. It requires Windows Phone 8.0 or later.

Connect the app with your desktop

Open up a command prompt or shell and change directories to your PhoneGap application and type “phonegap serve”. Take note of the IP address that the server is listening on.

> cd hello-world-app
> phonegap serve
[phonegap] starting app server...
[phonegap] listening on 192.168.1.199:3000
[phonegap]
[phonegap] ctrl-c to stop the server
[phonegap]

Open the PhoneGap developer app on your mobile device. Enter in the IP address the server is listening on and press “Connect”. In this example, 192.168.1.199:3000.

Connect with developer app

The server will wait for any IO changes on your project directory and will automatically send a refresh to the mobile device. Open up your project index.html and make some changes.

<div id="deviceready" class="blink">
    <p class="event listening">Connecting to Device</p>
    <p class="event received">This line will change when saved.</p>
</div>

Automatically updated

Hutz Media LogoBryan Wiebe is a web developer and mobile developer located in the Okanagan, British Columbia. He works for Hutz Media Ltd. This post is an entry in a blog series covering development with PhoneGap.