Install and update XAMPP with virtual hosts on a Mac

When I bought my first Mac (an unibody MacBook btw.) I got into trouble installing XAMPP on it. I had problems with file permissions, configuration and not working virtual hosts. Spending hours of searching the web, I finally came up with a working XAMPP installation including virtual hosts. In order to help other mac and/or XAMPP greenhorns I wrote this quick how-to.

Step 1: Download XAMPP

Download the latest XAMPP for Mac OS X.

Step 2: Back up your old installation

Skip this step if you are installing XAMPP for the first time.

When you've already installed XAMPP on your Mac, you might have special data you should back up first. This could include:

(MySQL) data bases (you can export these with the PHPmyAdmin)
special configuration and/or virtual hosts
files in the htdocs directory
etc.

When your're done backing up all important data, delete the old XAMPP directory in the "Programs" section.

Step 3: Install

Now just install the latest XAMPP on your Mac.

Step 4: Edit `httpd.conf`

Head over to "/xamppfiles/etc/httpd.conf" and make sure, you are authorized to read and write that file. Open it and look for this code:

User nobody
Group nogroup

Change it to:

User YOURUSERNAME
Group admin

Off course YOURUSERNAME is your valid user name.

Step 5: Set up virtual hosts

You can skip this step if you do not want to use virtual hosts.

Open "/xamppfiles/etc/httpd.conf" and un-comment the following line:
Include /Applications/XAMPP/etc/extra/httpd-vhosts.conf
Then head over to /xamppfiles/etc/extra/httpd-vhosts.conf, check writing permissions, open it and replace "NameVirtualHost *:80" with "NameVirtualHost 127.0.0.1".
Delete the line:
<VirtualHost> ... dummy-host ... </VirtualHost>
Now you are ready to add as much virtual hosts you need. Simply add the following code for every vhost:
<VirtualHost 127.0.0.1> ServerName test.dev DocumentRoot "/Users/YOURUSERNAME/Documents/test-docs/" <Directory "/Users/YOURUSERNAME/Documents/test-docs/"> Options Indexes FollowSymLinks Includes ExecCGI AddType text/shtml .shtml AddOutputFilter INCLUDES .shtml AllowOverride All Order allow,deny Allow from all </Directory> </VirtualHost>
test.dev is the name of your website in the browser. So instead of yourdomain.com you can name it yourdomain.dev or something you like. After that, change the two file paths to where ever your website files are located on your hard drive. The example above also includes the most common host configuration. If you want, change it according to your needs.
Open the Terminal and type:
sudo pico /etc/hosts
Now enter your admin password. You'll get a little text editor in the console. Go to the last line and add this line:
127.0.0.1 test.dev
with the correct name for every virtual host you would like to set up. When you're done, type control-o, then enter and then control-x in order to save and close.

Last step: Start Apache

Start Apache with the XAMPP control panel. Open your web browser and type test.dev or whatever you named your website in the httpd-vhosts.conf. You now should see your website using XAMPP (and virtual hosts) on your Mac.

Now start developing great web applications =)