The Phonegap Developer app just recently hit the app stores, and it’s awesome!
This app basically allows you to see any changes you make update in real time on your device. For example, if you fire up a Phonegap project called MyApp through the developer app, and make a change in MyApp/www/index.html, you will see that change on your device when you save index.html.
This saves you from having to rebuild and reinstall the app every time you make a change.
I’m going to show you how to install and use it in this post. (If you didn’t see the release post, check it out here.)
1. Install or update Phonegap CLI
If you don’t have the Phonegap CLI tools, you will need them. Run this command in terminal:
$ sudo npm install -g phonegap
Noob note: don’t paste the $
If you are using an older version of the cli tools, you can update with this command:
$ sudo npm update -g phonegap
2. Install the PhoneGap Developer App
3. Create or open an app
I don’t have anything to add here, this is straight from the Phonegap post.
$ phonegap create my-app $ cd my-app/
Or open an existing app:
$ cd ~/Development/app/my-existing-app
4. Pair the CLI and Developer App
This is where it gets a little tricky. Make sure you are in your project folder, then run this command:
$ phonegap serve
It will show you something like this:
[phonegap] starting app server... [phonegap] listening on 192.168.1.76:3000 [phonegap] [phonegap] ctrl-c to stop the server [phonegap]
Now open the Phonegap Developer app on your device. Click that box in the center with the IP address, and enter the IP address you see in your console.
In this case, it’s 192.168.1.76:3000, so you’d enter that full number in the developer app, and press connect.
Now you can edit your project files as needed, and when you save you will see your changes in real time on your device.
This is a great time saver for Phonegap development, nice work Phonegap Team!