PhoneGap 3.4.0 Installation on Windows 7

Wrote up this little walkthrough for installing PhoneGap 3.4.0 (and its dependencies) and getting a basic environment set up on Windows 7 for co-workers.  Maybe this will help someone else… If you have any issues, they’ll probably be beyond me, but I’ll try to help.

1. Create Dev Folder

  • c:\development
  • or wherever you want really…

2. Install Node.js

  • http://nodejs.org/

  • you’ll need this later to install the latest version of phonegap, currently 3.4.0, via npm

3. Download Apache ANT Binary to Dev Folder

4. Install Java Development Kit

5. Download Android SDK Bundle to Dev Folder

  • http://developer.android.com/sdk/index.html

  • extract

  • go to the eclipse folder and run exe

  • run sdk updates in the sdk manager

  • setup and save an emulator (you’ll need this later)

  • reference: http://docs.phonegap.com/en/edge/guide_platforms_android_index.md.html#Android%20Platform%20Guide_configure_an_emulator

6. Update Windows System Paths

  • Go to: Start > Computer (right click) > Properties > Advanced System Settings > Environment Variables

  • PATH (append to whatever is there already)

    • %JAVA_HOME%\bin;%ANT_HOME%\bin;%ANDROID_HOME%\platform-tools;%ANDROID_HOME%\tools;

  • ANT_HOME (create this)

    • C:\path\to\apache-ant-x.x.x

  • JAVA_HOME (create this)

    • C:\Program Files\Java\jdkx.x.x_x

  • ANDROID_HOME (create this)

    • C:\path\to\adt-bundle-windows-x86_64-xxxxxxxx\sdk

  • replace x’s with whatever version your downloaded
  • replace path\to with your path

7. Install PhoneGap

  • Open node.js command prompt

  • npm install -g phonegap

8. Create HelloWorld App

  • still in the node.js command prompt? navigate to your dev folder, or wherever you want to store your apps, for example: c:\development\apps
  • phonegap create my-app
  • cd my-app
  • phonegap run android
    • this should open on your android if it’s connected via usb, or it will open in the emulator you set up in Eclipse

  • reference: http://phonegap.com/install/

9. Profit!

  • 🙂

InkMedic Tattoo Aftercare

InkMedic Web Design and Web Development

InkMedic needed an identity and an online presence with ecommerce capabilities to expand their reach outside of Palm Coast, Florida. The new visual style reflects their customer base, and the JigoShop shopping cart has made adding products and processing orders much easier.

Project Specs

My Role: photoshop, html, css, wordpress, logo design, adwords and facebook campaigns

Client Location: Palm Coast, Florida

Created For: Personal Client

View Site

Recycle North / ReSOURCE

ReSOURCE VT Web Design and Web Development

Recycle North was much more than their name let on. After extensive re-branding and a new website, the full spectrum of ReSOURCE and its sub brands’ programs, services, and opportunities are easily accessible.

Project Specs

My Role: photoshop, html, css, web design, web development, drupal

Client Location: Burlington, Vermont

Created For: Brandthropology, Inc.

View Site

Munstre Light Boxes

Munstre Web Design and Web Development

As Munstre’s unique art was gaining attention outside of local Boston galleries, it needed a venue that would allow this wider audience to access its work. Munstre.com provides this showcase for the available product lines.

Project Specs

My Role: Photoshop, html, css, web design, web development, javascript

Client Location: Boston, Massachusetts

Created For: Personal Client

View Site