How to create virtual host in xampp on windows, mac and linux?

How to create virtual host in xampp on windows, mac and linux?

We have all been here at least once. You wanted to use separate url for your each of your project instead of old localhost. Today, we will see how exactly we create virtual host in xampp when you are on windows, linux or mac.

In order to get started, we need to make sure that we have a working apache server. In our case, we are going to take advantage of XAMPP.

Now, since we have our requirements out of our way, lets understand what are the procedures to create a virtual host.

What is virtual host?

According to wikipedia, Virtual hosting is a method for hosting multiple domain names (with separate handling of each name) on a single server (or pool of servers). This allows one server to share its resources, such as memory and processor cycles, without requiring all services provided to use the same host name.

How can we create virtual host in xampp (apache server)?

Creating virtual hosts involve three general steps.

  1. update virtual host configuration file with proper information.
  2. update host file of the host computer with new virtual host information
  3. reboot apache

Now, lets see how exactly can we do this.

Updating apache virtual host configuration file.

First, locate the virtual host configuration file.

For Windows, expecting you have installed XAMPP in C:, you should have your virtual host file in location C:/xampp/apache/conf/extra as httpd-vhosts.conf.
You should open this file with Notepad++(preferably) so you have some formatting and its easier to navigate. Now go to the bottom of the page and paste for following code to create a virtual host myapp.local

<VirtualHost *:80>
    ServerAdmin [email protected]
    DocumentRoot "C:/xampp/htdocs/myapp"
    ServerName myapp.local
    ErrorLog "logs/myapp-error.log"
    CustomLog "logs/myapp-custom.log" common
 </VirtualHost>

For Linux and Mac: By default, apache is not configured to load the httpd-vhosts.conf file, we need to edit another file to make sure it loads the httpd-vhosts.conf file before we edit it. We can locate that file in following address,

For Linux,

/opt/lampp/etc/httpd.conf and now, open it with your favourite code editor. In that file, locate the following lines,

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

change it to following and save. Note: extra space added on path to file for security reason, please type instead of copying path.

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

For Macs, the file is located in /Applications/XAMPP/xamppfiles/etc/httpd.conf

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

again change it to the following Note: extra space added on path to file for security reason, please type instead of copying path.

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

Please note, we have just uncommented the second line, which will allow apache to read the details on httpd-vhosts.conf file, which will have our virtual host information

Now, for both linux and mac, we can proceed and change update the virtual host file with a code editor which is located in Linux: /extra/httpd-vhosts.conf
Mac: /Applications/XAMPP/etc/extra/httpd-vhosts.conf

Inorder to create the virtual host, we just have to add the same information we added in windows

<VirtualHost *:80>
    ServerAdmin [email protected]
    DocumentRoot "C:/xampp/htdocs/myapp"
    ServerName myapp.local
    ErrorLog "logs/myapp-error.log"
    CustomLog "logs/myapp-custom.log" common
 </VirtualHost>

Note: DocumentRoot is your project public folder and ServerName is your new domain, other items are pretty much self explanatory

Now, the first step has completed, its time for us to update the newly created virtual host detail in your OS’s hostfile, open the host file from the respective locations listed below with super user privilege:

Windows : C:\Windows\System32\drivers\etc\hosts
Linux: /etc/hosts
Mac: /etc/hosts

From there, add the following line at the end, save it and restart apache.

127.0.0.1 myapp.local

After that, myapp.local on your browser and see and it should work. Sometimes, you might need to reboot your Machine. Good Luck!

How to create virtual host in xampp on windows, mac and linux? 1