I do quite a bit of design and development with my company. To keep things streamlined I’ve setup my machine as a local development server to avoid the obvious hassle of having to FTP files every time I make a change that I want to see. […]

I do quite a bit of design and development with my company. To keep things streamlined I’ve setup my machine as a local development server to avoid the obvious hassle of having to FTP files every time I make a change that I want to see. Setting up your machine as a development server is another post for another day, but since OS X comes with Apache, this really should work for pretty much anybody on OS X.

One of the hassles with developing locally is having to access the various sites I’m working on with something like: http://localhost/theappleblog/

This isn’t very convenient in term of things like absolute links to images or other pages within the site. Ideally you’d have something like: http://theappleblog.dev

Notice the “.dev” instead of “.com”? That’s what we’ll be setting up. This way you won’t need to worry about the method you are linking to images and other pages. Is it a necessity for development? No. Is it nice to have? Very.

The Setup

The first thing we need to do is edit the hosts file. This file will let us override what the browser thinks of the .dev TLD since .dev doesn’t really exist in the domain world.

  1. First, fire up terminal and type in: sudo pico /etc/hosts
    This will give you something like this screenshot.
  2. Next, you’d want to type in: yourdomain.dev
    This basically tells your browser that yourdomain.dev should point to localhost and not try to search for it elsewhere.
  3. After typing in that, you’ll want to save that file (Control+X). Keep Terminal open though.
  4. Now we need to edit the httpd.conf file for Apache. For me, this is located in /private/etc/httpd/ though your setup could vary. Open up the file in your favorite code editor and do a quick search for “NameVirtualHost”. Make sure it’s not commented out. If it’s comment out, uncomment it out. If it’s not there, then add it. Either way, you should have a line with this: NameVirtualHost
  5. Below that, we’ll add a VirtualHost rule to tell our yourdomain.dev where to point to.

    <VirtualHost yourdomain.dev>
    ServerName yourdomain.dev
    DocumentRoot "/Users/UserName/Development/yourdomain"

    The DocumentRoot needs to be set to wherever your development folder is for whatever you are working on.
  6. Finally, we need to save the file and then restart Apache. Restart Apache within Terminal by typing in something like sudo apachectl graceful (depending on your setup).

After restarting Apache, you should be good to go! Fire up your browser of choice and type in your new development domain and you should see your main index file!


You’re subscribed! If you like, you can update your settings

  1. Pretty good hint here. Doesn’t completely eliminate the Find & Replace step of replacing the local paths with the ones for the server though. Might be better to setup the host file to redirect from the actual server to the local copy and just change the host file as needed.

  2. Did something similar but used dev in a different place:


    I use this method because a lot of my customers use load balancing and to access individual servers I usually have to type in:


    – Chris

  3. How To Setup Development Domains On OS X at super hanc petram Tuesday, November 21, 2006

    [...] The Apple Blog: How To Setup Development Domains On OS X Search [...]

  4. That’s good if you were the only one working on said project. If you have a team then it is pretty useless. And I hope you’re running the same PHP, Ruby, SQL version as the host you paid for or is again, useless. Is it too hard to setup a hock key in your editing app to auto-upload when you save?

  5. …::: SLACKDOT.COM :::… » How To Setup Development Domains On OS X Tuesday, November 21, 2006

    [...] read more | digg story [...]

  6. Jonathan Haddad Tuesday, November 21, 2006

    @ Ryan Merket – Auto upload when you save.. to what?

    My 2 cents..

    If you’re working with a team, I’ve found a great setup is to have each person do their cvs or svn checkout into a vhost directory, and have apache set up to do mass hosting. for example, i always check out to jh.dev.whateverdomain.com. This way, everyone is working off the same machine, so you only need to maintain 1 dev database and apache setup. You also don’t have to mess with hosts files, if you know how to set up your DNS the right way. Everyone has their own checkout.

  7. I wrote a script that we extensively use in the office to do just this. The script takes care of setting up Apache and Mac OS X to recognize the development host name.

    To setup a host, you would just type:

    sudo virtualhost.sh yourdomain.dev

    Answer a couple prompts including what you want the virtual host’s DocumentRoot to be, and away you go. To remove a virtual host you’ve created:

    sudo virtualhost –delete yourname.dev

    Note that this script is assuming the stock install of Apache that comes with Mac OS X, and that you haven’t already messed around too much in httpd.conf.


  8. If you are using the built in apache webserver that comes with OS X (apache 1.4) I recommend the following.

    Rather than editing httpd.conf (which contains global settings), you can add the virtual host information into /etc/httpd/users/.conf.

    This is file is appended to httpd.conf once you login to OS X.

    Also, rather than editing the hosts file directly, I recommend using the tool that comes with OS X (Applications/Utilities/Netinfo Manager).

    Select Machines->localhost. Click on Duplicate. Enter your details.


Comments have been disabled for this post