Setting up multiple test sites in XAMPP via virtual sites

It’s NEVER a good idea to test new designs, programs and/or learn new stuff on a production website. This article describes how to create multiple virtual servers on a Windows 7 platform using XAMPP to create a perfect Linux/Apache like test bed.XAMPP + Win7 = great platform to test WordPress, MovableType and   Drupal

Some Context

I’m in the process of re-factoring some websites I’ve let go fallow far too long. Part of this process includes setting up a Linux-like test site on my brand new Windows7-driven Lenovo U350 via XAMPP.

Yeah, I know, that was a lot all at once, so let’s break some of this down for those of you who don’t code for a living:

What’s XAMPP?

The WikiPedia defines XAMPPas follows:

(pronounced /ˈzæmp/ or /ˈɛks.æmp/[1]) is a free and open source cross-platform web server package, consisting mainly of the Apache HTTP Server, MySQL database, and interpreters for scripts written in the PHP and Perl programming languages …

… The program is released under the terms of the GNU General Public License and acts as a free web server capable of serving dynamic pages. XAMPP is available for Microsoft Windows, Linux, Solaris, and Mac OS X, and is mainly used for web development projects..

In short, XAMPP gives me a Linux/LAMP development platform on a Windows based machine.

My Situation

Whether it’s learning something for work, or working on a church website, often find myself jumping between languages such as Perl, PHP and Python … and content ‘manglement’ systems such as WordPress, Drupal and MovableType, I find it’s easier to keep things organized if I:

  1. keep each project in its own path
  2. establish a virtual server for each project
  3. enter the project name in the address bar of my browser

Getting it done

By default, “localhost” is the default domain name for your PC. It resolves to IP address 127.0.0.1.

But just as a hosting provider can support several domain names on a single IP address, so too can your Windows system.

Below are the steps to get this done:

Step 1 – identify the new host

Unlike Windows XP or Vista,  for Windows 7 you’ll need to right click on the NotePad program and “Run as Administrator” as pictured below:

Notepad - Open as Admin

This is because the file we want to edit is now protected. That file is located at:

[bash]

C:\Windows\System32\drivers\etc\hosts

[/bash]

Once you’ve opened the file and on or about line 23, edit your file so it reads:

[bash]

127.0.0.1       localhost
127.0.0.1       drupal

[/bash]

Save it, close your notepad editor, so you don’t shoot yourself in the foot in admin mode.

Step 2 – establish the virtual host

Keep in mind, the primary purpose of XAMPP is to give you an Apache server that runs on your local machine.

That in mind, you’ll need to edit one more file:

[bash]

notepad C:\xampp\apache\conf\extra\httpd-vhosts.conf

[/bash]

Once in, you’ll want to modify it so it reads:

[bash]

NameVirtualHost *:80
<VirtualHost *:80>
ServerAdmin postmaster@dummy-host.localhost
DocumentRoot "C:/xampp/htdocs"
ServerName localhost:80
ServerAlias localhost
ErrorLog "logs/dummy-host.localhost-error.log"
CustomLog "logs/dummy-host.localhost-access.log" combined
</VirtualHost>
<VirtualHost *:80>
ServerAdmin postmaster@drupal-host.localhost
DocumentRoot "C:/xampp/htdocs/drupal"
ServerName drupal:80
ServerAlias drupal
ErrorLog "logs/drupal-host.localhost-error.log"
CustomLog "logs/drupal-host.localhost-access.log" combined
</VirtualHost>

[/bash]

Note, in the default XAMPP install, the above is commented out, and the hosts are dummy and dummy2. I simply un-commented everything and renamed dummy2 to drupal.

Step 3

Restart your Apache server. The easiest way to do this is stop and start the server through the can be done through the console as pictured below:

XAMPP Console

Step 4 – Test It

Finally, you’ll want to test it by entering “drupal” in the address bar of the browser of your choice.

Before you do that, you may want to create the directory C:\xampp\htdocs\drupal …

… and then add an index.html, .php, .pl OR .py file to provide the ubiquitous “Hello World!” to demonstrate everything is running as planned.

Wrap-up

Additional Resources

I’m not the first person to write on this topic, nor will I be the last. That said, here are some other sites that offer similar tutorials in case the one above is still as clear as mud.

Why Bother?

Some of you may be wondering why bother at all? Why not just work on your live site.

Personally, as an IT professional with a couple of decades experience, I can say with utter certainty – backed-up with copious examples – that this is a recipe for disaster.

Instead, why not simply take an old box and install a Linux distribution such as Ubuntu or Fedora … or do what I did, took a new box an added XAMPP.

Either way, you’ll be glad you did when one of your tests or learning experiences fries your non-production site.

Posted in Uncategorized