How to create virtual hosts on your local XAMPP web server
This article shows how you can easily create virtual hosts with an Xampp web server.
Xampp is a commonly used and popular web server to install locally on your PC or Mac. You can download it here: link.
Objectives of this article
After successful installation you create your websites in the folder htdocs Let's say you have a project named popcorn and you would like to open via: http://popcorn:8088. This would mean that you have to address 8088 as the port that is "listened to" by your Xampp web server and you need a DNS entry that recognizes popcorn.
How to do this in Xampp
First of all make sure what port Apache is listening to. You can see in the image above that here it is listening to port 8088 for http traffic and port 444 for https traffic. You can change this by clicking on the
button in the Xampp admin console.
Now change the ports to your own liking. Don't use port 80 however, for it would put your PC wide open to the internet. After setting the ports, save it and restart Apache in the Xampp admin console.
Next step is to create the virtual host that tells Apache how popcorn should be interpreted.
Go to the folder: \apache\conf\extra and open file: httpd-vhosts.conf
Let's assume that your popcorn is in folder \htdocs\popcorn-1.2.3 Now add the following section to the end of the file (modify it to your own project needs)
ServerAdmin firstname.lastname@example.org DocumentRoot "C:/XampServer/htdocs/popcorn-1.2.3" ServerName popcorn ServerAlias popcorn Order allow,deny Allow from all
After saving this file, restart the Xampp server (only the server, not MySQL).
Since we are working with a Windows PC, we have to modify the DNS entries in the local hosts file.
Open the file: \system32\drivers\etc\hosts.
Possibl you can't access the file and have to modify the attributes to make it editable.
Add the following entry to this file (again modify it to your own needs):
127.0.0.1 popcorn #Xampp c:\Xampserver\htdocs\popcorn-1.2.3
After the # is just comment, but it is handy if you have a lot of entries to tell where it can be found on the web server.
Now you're done and can you access: http:\popcorn:8088, on your local web server.