If you create websites or web apps for the iPhone OS (iPhone, iPad, iPod Touch), it's important to setup a solid local development environment for testing. Using a desktop web browser (even Safari) or one of the many available "emulators" for testing is worthless because the real thing looks different.

The only way to test properly is with Apple's iPhone Simulator. Since you can't just type a local file path into the simulator, I'll show you step-by-step how to get it working (on a Mac).

What You Need

• Latest version of the iPhone SDK
• MAMP for Mac
• A text editor of your choice ... I love Textmate. You won't have to use Dashcode.

1- Install the SDK (with Xcode) and MAMP

The SDK is about 2.8GB so you should give it a while to download. Installation took about ten minutes for me.

What's MAMP?

MAMP is a great little application that gets you up and running with the local server environment on your Mac in about five minutes. All you need to do is install it like any other application.

2- Setup the location of your website or web app

Create a folder for your project. It can be anywhere on your computer. Place an index.html file in it with "hello world" or whatever you need to test that it's working when we open the simulator.

For this tutorial I'm going to call my folder "iphone-site" and put it in /Users/Nick/Sites/ on my computer.

3- Create an alias in MAMP

Go to the location where you installed MAMP (probably Applications), then open this file: /MAMP/conf/apache/httpd.conf. Around line 655 you should see the following code:

Alias /MAMP "/Applications/MAMP/bin/mamp"

<Directory "/Applications/MAMP/bin/mamp">
    Options Indexes MultiViews
    AllowOverride None
    Order allow,deny
    Allow from all
</Directory>

Add a line of space after this code, then create your alias with this code:

Alias /iphone-site/ "/Users/Nick/Sites/iphone-site/"
<Directory "/Users/Nick/Sites/iphone-site/">
    Options Indexes FollowSymLinks
    AllowOverride All
    Order allow,deny
    Allow from all
</Directory>

Replace the file path above with the file path to your site in both places.

Save the file and close it. Please note that if you ever make edits to the httpd.conf file while your MAMP server is running, you will have to restart the server to see those changes take effect. Also, if you ever change the location of your site, of course this file will have to be updated with the new file path.

What this does is keep the URL clean and easy to remember. Setting up an alias is not technically required, but I highly recommend it. Instead of the URL being this:

http://localhost:8888/Users/Nick/Sites/iphone-site/

The new, clean URL would look like this:

http://localhost:8888/iphone-site/

4- Test It

Launch MAMP and make sure that the server is running. The window should look like this:

Now it's time to open the iPhone simulator. Open a finder window and navigate to the drive you installed the developer kit on (eg. "Macintosh HD"). The simulator is in the /Developer/Platforms/iPhoneSimulator.platform/Developer/Applications/ folder. It's a good idea to add it to your dock so you can access it easily in the future.

Once the simulator is running, open Safari. Navigate to http://localhost:8888/iphone-site/. Of course you will want to substitute iphone-site in the URL for the name of your project. You should see "hello world" (in very tiny text), which means you are good to go!

Now you can develop iPhone websites and web apps without depending on an internet connection, which should speed up development time significantly. Whenever you start another iPhone project, simply add another alias to your httpd.conf file and get started!

Testing on the iPad

The iPhone OS SDK version 3.2 and up includes support for the iPad in the iPhone Simulator application. It's a little confusing, but think of the iPhone as more of an operating system rather than a device in this context. From the iPhone Simulator, click "Hardware" in the main menu, then "Device" and you can select between the iPhone and iPad.

What about debugging?

Mobile Safari has a debugging console, but I didn't find it too helpful for basic front-end development. There isn't a substitute for Firebug or Safari's developer tools, so I would suggest continuing to use those in a desktop browser if you get stuck. Using the same localhost URL will work in other browsers as well as the simulator.

Resource Library

Once you have your test environment going, it's important to familiarize yourself with the mobile Safari browser and how to make the most of it. Here is a set of articles to get you started:

• Apple: Getting Started with iPhone Web Apps- all of the resources available on this page are very helpful
• Apple: Preparing Your Web Content for iPad- a good basic introduction to formatting web content for the iPad
• jQTouch- in my opinion the best library for developing native-style web apps for the iPhone
• O'Reilly: Building iPhone Apps with HTML, CSS and Javascript- A book that's free to read online and a GREAT resource.

Thanks to my two partners Jared and Denny, I recently joined the masses of early adopters and became a proud iPad owner. Big shocker, I think it's an outstanding device that will change how we do things.

The iPad is so useful in fact that I think that's the biggest problem. It's another device that keeps me in perpetual "connectedness" with all things digital. At what point does this become a detriment to my attention span, productivity and physical well-being? I don't want to be more comfortable working in front of a screen than reading a new book or having an engaging dinner conversation, yet sometimes I feel that way.

This reminds me of a great scene in the movie Wall-E. Remember the spaceship all of the humans are on in the "future"? They are all plugged into these little pods and glued to a screen 24/7. They all get fat, no one uses the swimming pools and no one even talks face to face anymore. It's like they are zombies.

I feel more and more like the zombies in Wall-E every day. I wake up to an iPhone, exercise to a DVD, work in front of a screen 8-12 hours, then come home and regretfully spend at least a couple more hours in front of a screen of some sort.

Of course, this isn't the iPad's fault. I'm responsible for how I spend my time each day. I just find it amazing that technology is at a level where people have to purposefully make time to unplug and do things that are truly worthwhile in life.

Today I'm making a decision to try and unplug for at least 4-6 hours per day. No screens of any sort, except for the Kindle because I can read books on it without being disturbed. On weekends I hope it will be more like 8-10 hours. The iPad rocks, but nothing that creates lasting happiness can be found there.