Build an iOS and Android app in 5 minutes, without an IDE

Ok, a lofty goal, but a goal nonetheless. 

Lets setup, build, and deploy an iOS and an Android app [yes, that was an 'and', not an 'or'] in 5 minutes flat.   

A couple of preconditions... you must have administrator rights to your computer, be running OSX, and you must be willing to accept that the app is going to be... basic.  By basic, I'll concede it's just a picture, but a pretty picture, at that.  Regarding the OSX bit, you can definitely do this on iOS or *nix, but that will take an extra 5-50 minutes to setup, no guarantees on 5 minutes or less.

How exactly are we going to build this app, in such a short timeframe?  Don't we have to install xcode, the Android SDK, emulators, simulators, and the kitchen sink to do that?  Nope, not today!  We are going to [you likely guessed it] use Cordova [err, PhoneGap, err... Cordova? which is it...?] to do this.  We also have to have NodeJS on our development machine, and something called "ripple".

The sole reason for this post is to remind me of how to do this, because I have the memory of a toothpick.  If you find it helpful, great! That means I've pleased someone on the Interwebz.

Ready to do this?  Find your clock and make a mental note of the time, cause we start now!

  1. Install NodeJS by going to http://nodejs.org, click the big green install button and open the resulting file. Bam.
  2. Open Terminal [in /Applications/Utilities/Terminal] and execute commands 3 thru 6 by typing the text in bold.
  3. sudo npm install -g phonegap 
  4. sudo npm install -g ripple-emulator
  5. Navigate to a directory you'd like to store your app, for instance, type cd ~/Documents
  6. Create a new phonegap app by running the following [change com.sigmyers to whatever reverse domain name you'd like]: phonegap create demo com.sigmyers.demo Demo     
  7. Navigate into the "www" directory of your app: cd demo/www 
  8. start ripple by running: ripple emulate
  9. Pop open your favorite browser and for the domain name enter: http://localhost:4400/?enableripple=true 

Stop the clock! Stop the clock! [You didn't even start a clock... did you?] 

Voila!  You didn't think you'd get through that unscathed, right?  Lets recap exactly what we did here...  We used PhoneGap and Ripple to launch a default application into an iOS and Android "app" that is running via the browser.  Any browser can run this [provided it's not some really old browser], and more importantly, any one can get this running relatively quickly.   It took me a bit of reading which is why I wrote this demo... I didn't understand what exactly I was playing with, but now that I'm up and running it's a matter of popping open an IDE [ergh, I mean vim... or vi... or emacs if you're crazy], grabbing some HTML, CSS, and JavaScript and getting cozy.  More posts of this flavor to come!

 

Sig MyersComment