As a developer, it’s good to have a local and live environment. You can easily configure a virtual host in the XAMPP stack to achieve such flexibility.
XAMPP stack gives you an environment where you can run any combination of php + mysql on a Windows/Mac. We will demonstrate how to get set up, and create a local environment that won’t conflict with the settings of a live environment.
What is a Virtual Host?
A virtual host is used for hosting multiple domain names on a single server. This is what some host providers call as ‘shared hosting’ – where different websites share the same server and utilities for their desired project.
There are 3 types of virtual hosts:
- Name-based virtual hosting uses the host name presented by the client
- IP-based virtual hosting, allows multiple websites on the same server IP
- Por-based virtual hosting, hosts a common IP address but distinguishes on the bases of a unique port number
Create a Virtual Host
First navigate to where the XAMPP files are, and under apache, configuration, we will look
for the host file. The common directory is C:\xampp\apache\conf\extra , whatever the main driver is.
Next edit the httpd-vhosts.conf in editor of choice. I usually go for Visual Studio Code. We will create a name based virtual host, using a document root (where our website physically lives on our machine) and a ServerName directive that will be the new URL or name.
You can add the following to the end of the file:
<virtualhost *:80=""> ServerAdmin email@example.com DocumentRoot "C:/xampp/htdocs/mysite" ServerName mysite.com </virtualhost>
- VirtualHost: most web servers use port 80, but you can change this
- DocumentRoot: the folder where the files of the site exists, for apache usually this is located under the /htdocs folder with specific site name/li>
- ServerName: This is the URL of our virtual host
Add the following mapping to the Host file: 127.0.0.1 mysite.com
This will insure that the ServerName that we added in apache config will now map to the localhost or 127.0.0.1. Now make sure that you restart your Apache and MySQL from XAMPP Control Panel so that the changes take place. You can simply type mysite.com in the url and see the site running! Also make sure to turn on logging – if you run into any issues the logger file will capture them.
References: https://httpd.apache.org/docs/2.4/vhosts/examples.html https://www.digitalocean.com/community/tutorials/how-to-set-up-apache-virtual-hosts-on-ubuntu-16-04