Developing for Phone Gap using Visual Studio on TFS

Being used to visual studio development and starting with development for Phone Gap. I was successful to start working with eclipse and created my projects and loaded them to TFS.

It wasn't easy to work on eclipse and the emulator was too slow on my machine. The intelli-sense and editor of eclipse even after downloading Web Page Editor, wasn't comfortable to me.

After some trials and research, I found that we can use Visual Studio as an IDE and Ripple Emulator on Chrome browser.

So after creating your Phone Gap project and uploading it to TFS,you go to VS2012
==> Open website ==>Source Control

==> Select Source Control Project
then Choose your application from the Team Explorer

then choose a local folder to work in
and choose Run as IIS Web site
and choose the URL to host on IIS

Now you have 

Now to test your application on an emulator we need Google Chrome browser and Ripple Emulator 

after downloading them, you will have a ripple icon in the browser  toolbar as follows

Next after enabling Ripple, we can try by going to visual studio and choosing index.html and right-click ==> View in Browser(Chrome).

If Chrome is not default, use File ==> Browse With and choose Chrome (Set as Default), 

You will find a black page with multiple choice of platforms chooseApache Cordova 2.0,

And the you will find your page shown on the emulator which you can change and choose any device or platform as follows

Now you can edit and add you HTML, JS and CSS files in VS and test it in the chrome emulator.

Next I will write an article on accessing WCF webservices using jQuery in Phone Gap.

But to test the application on a device, we need eclipse and to finalize the application we need eclipse too. Take care that some PhoneGap features are not yet supported on Ripple. An example of such features is FileTransfer.

Thanks,

Nerdy Geeky J!