rectanglicle

the personal website of ash m. white

13
Nov
2009

How To: Develop Your iPhone Web Apps With Your Mac

Filed under: Development, iPhone, Tips & Tricks

Tagged: apache, apple, css, html, iphone, javascript, simulator

If you are building an iPhone web app, chances are you have gotten a bit tired of relying on your device for testing changes. It can definitely be tedious to upload your changes, pick up your device, and refresh Mobile Safari each time you make a change to your code. Here's a way to use your Mac to eliminate the device and the remote server from the development process.

Step 1 - Download the iPhone SDK

For this to work, you will need to download the iPhone SDK from the Apple website. This is a free download, but you will need to create an account and log in to gain access to the software downloads.

 

Step 2 - Make a Sandwich

The iPhone SDK is big. More than 2 gigs. Make a sandwich while you wait for it to download. Go on, you look hungry.

 

Step 3 - Install the SDK

This will also take a little while (see Step 2). If necessary, make another sandwich.

 

Step 4 - Load up the iPhone Simulator

After the install finishes, you can find a fully-functional iPhone simulator located in

/Developer/Platforms/iPhoneSimulator.platform/Developer/Applications/iPhone Simulator.app

Since this app is a bit hidden, I suggest creating a shortcut to it in your Dock or desktop, or by using Spotlight to launch it when needed.

 

 

Step 5 - Turn on Web Sharing

In order to access your web apps from your local machine without having to upload them to a remote server, you will need to enable Apple's Web Sharing in System Preferences -> Sharing. This turns on the built-in Apache web server that ship with every Mac.

 

Step 6 - Load up Your App

Now that you have a working iPhone simulator and a web server on your computer, you are free to access your apps from the simulator. First make sure that your iPhone is on the same WiFi network as your computer, then simply launch Mobile Safari and navigate to http://localhost/~your_mac_user_name. This address corresponds to the folder /Users/your_mac_user_name/Sites on your hard drive, so this is where your apps will need to live. There are ways to change that, but I'll leave that for another how-to.

Comments

There are no comments yet

Leave a Comment

I am a software developer and designer in Athens, Georgia. I'm passionate about web development, graphic design, and web standards. I am currently enrolled in the University of Georgia Master of Internet Technology program. More...

@ashwhite

Dear @charlesproxy, You're amazing. Love, Ash

about 15 hours ago

Thanks to @johnallsopp for the very inspiring talk tonight about HTML5 and the future of web technology.

about 3 days ago

@Stormink Other bad changes aside, CDs are not analog. If the icon had started as a vinyl record, that would be a totally different story.

about 3 days ago

@koefod You're on a Mac, right? You should give this a try: http://agilewebsolutions.com/products/1Password

about 3 days ago

When method names include the word "kludge," it's a bad sign.

about 4 days ago