1. In order to download and install the Mac OS developer's package, you first need to register with Apple as a developer. Go to http://developer.apple.com/programs/register/.
2. If you have an iTunes username and password, you're welcome to use it or create a new one specifically for your development work. There are two options. You can register as an iOS developer, which costs $99 for a year and allows you to submit iOS applications to the iOS App Store. If you're not planning on doing any iOS development, you can simply download XCode 4 from the Mac App Store.
3. Once you've gone through the free registration at Apple's site, launch the Mac App Store and search for xcode.
4. Once XCode is installed, you can use the Mac's computer-wide search to find the iOS Simulator, as shown in the following screenshot:
5. Launch it and click on the Mobile Safari icon in the bottom tray. Go to
http://dpk.local. It should appear in your desktop browser, as shown in the following screenshot:
Debugging CSS and JavaScript for web pages is never easy. It's made even more difficult with the proliferation of desktop operating systems and, now, handheld and mobile operating systems. No matter which browser claims to have "emulation" or modes that simulate this other browser or that, it's not a substitute for looking at the web page in the actual browsers. Debugging pages in Internet Explorer, requires an install of Windows XP and the browser itself. Don't settle for anything less. With handheld devices, you really need a virtual environment where the handheld OS is running a real version of the browser.
In this exercise, we created such a virtual environment. The XCode package creates the environment for the iPhone and iPad, and the Android development environment creates the virtual machine for any OS capable of running Java.