Virtual Hosts with Apache on a Mac

Asif Ahmed

One best practice with building websites and web applications is to build and test locally. In a previous post, we briefly covered how to deploy a WordPress install on your localhost. However this time we will cover how to install Apache on a Mac and deploy several virtual hosts. This means that if you type in something like http://example-site.dev in the address bar of your browser you can go to a local instance of your website instead of going to something like http://localhost/~sifxtreme/example_site/public/ or something similar. There are actually a lot of article out there that cover this issue, but not many focus on getting the virtual host set up working on a Mac. And almost all of them leave out one critical step that can cause headaches. I’ve definitely gone over these tutorials and been frustrated.

First download and install MAMP – http://www.mamp.info/en/index.html.

Then, open up the Terminal. Yes, we will be doing things with command line. I know it can be icky, but it’s really the best way to configure stuff like Apache, MySQL, server admin, etc. Now make a directory at your home.

cd
mkdir Sites
cd Sites

Now make a folder and put some sample web code in there.

mkdir example-project
cd example-project
echo "<php echo 'Hello Everybody!'; >" > index.php

Now, let’s start the Apache configuration. Open up your Apache configuration file sudo vim /Applications/MAMP/conf/apache2/httpd.conf and remove the “#” from the second line. This will enable virtual hosts.

# Virtual hosts
#Include etc/extra/httpd-vhosts.conf

Now, we have to set up some virtual hosts. Open up your virtual hosts configuration file (sudo vim /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf) and change it so it looks similar to this.

NameVirtualHost *:80</code>
<VirtualHost *:80>
    DocumentRoot "/Users/sifxtreme/Sites/example-project"
    ServerName example.dev
</VirtualHost>

Obviously change “sifxtreme” with your own name. Now let’s change our hosts file so our computer knows to point something like “example.dev” to our localhost. Add this line to the end of your hosts files (sudo vim /etc/hosts).

127.0.0.1 example.dev

Now we should we good to go, right? This is where most tutorials stop. If you go to http://example.dev in your browser and see something about Access Forbidden, that is normal! Go ahead and search for something like that lists the User/Group in the httpd.conf file that we edited earlier. For me, it looked like this –

# User/Group: The name (or #number) of the user/group to run httpd as.
# It is usually good practice to create a dedicated user and group for
# running httpd, as with most system services.
#
User daemon
Group daemon

I changed the daemon on the first line to “sifxtreme” and I changed the daemon on the second line to “staff”.

Now restart your MAMP server and you should be good to go. Please email me if you have any questions. Setting this up can be frustrating at times.

This was one of the more helpful links I found for setting up a virtual host. http://f6design.com/journal/2012/03/11/configuring-virtualhosts-in-xampp-on-mac/