Configuring multiple virtual hosts for web development using MAMP on a Mac

I've been using MAMP for awhile because it offers a neatly encapsulated MySQL and Apache installation that's easily installed on a Mac. Want to do some web development? Simple, download and install MAMP, click on the MAMP application, and you can view your app in http://localhost:8080/ .. however this isn't ideal. What if you're working on multiple applications at a time? What if you want the web files in your home directory rather than in /Applications/MAMP/htdocs?

Here's a couple simple tricks to use.

First, if you don't need the Apache that Apple provided, go into your system preferences and turn off Web Sharing. Doing so will free port 80 for your use. The next step to this is to go into the MAMP preferences, click on the Ports tab, then click on the button marked "Set to default Apache and MySQL ports". This changes Apache to use port 80 and MySQL to use port 3306. These are the standard ports meaning the usual tools will behave as usual, rather than you having to remember to specify nonstandard ports all the time.

That part is optional of course. Maybe you have a reason to leave the Apple-provided Apache in operation. Or maybe you like using nonstandard port numbers. If you want to do it the hard way be my guest, go ahead and knock yourself over the head with a hammer, don't let me stop you from hurting yourself.

The next part is the fun non-optional part. This is where we implement virtual hosts within MAMP.
First step is to create some host names. In /etc/hosts add a few lines like

127.0.0.1 proj1
127.0.0.1 proj2
127.0.0.1 proj3
 

With that done visiting http://proj1/ gives you a blank directory listing. So long as it doesn't give an error that means the Mac recognizes it as a domain name. The next step is to configure MAMP to recognize the domain name and map it to a directory on the file system.

Edit /Applications/MAMP/conf/apache/httpd.conf and go to the very end. Add the following lines

NameVirtualHost *:80
Include /private/etc/apache2/extra/httpd-vhosts.conf 
 

This turns on virtual host support. Normally virtual host declarations are done at that point in the configuration file, but it's convenient to put the declarations in this other file. The Include directive simply says load the configuration in the named file, and it's this one where we'll put the virtual host declarations.

The file will have an example virtual host declaration and you should edit it to look something like this:


DocumentRoot "/path/to/proj1"
ServerName proj1
ErrorLog "/private/var/log/apache2/proj1-error_log"
CustomLog "/private/var/log/apache2/proj1-access_log" common
 

Obviously /path/to/proj1 is up to you and can be whatever directory path floats your boat. Simply add one of these sections for each virtual host you're using, and make sure to substitute "proj1" with whatever token you choose for each project.

Now restart MAMP and you should be good to go.