Setup Virtual Host in Windows with Xampp Server

In this article, we are discussing Setup Virtual Host in windows on xampp server. You must be aware of XAMPP Server before this tutorial implementation. XAMPP is a cross-platform open-source web server bundle. Anyone, who is new to the development or using of XAMPP, can visit here and download supported version as per your requirement and machine compatibility.

Why we need Virtual Host?

Virtual Host allows you to use an alias name for your localhost. We can setup multiple virtual hosts as per our need so that each local website can be accessed through the specific name. Virtual address means IP-based, you can use different IP or different name for each IP.

In other words, assume your site resides in http://localhost/client/site1 and when you want to execute the site on the browser. It’s hard to write complete path manually. Here’s virtual host help us. For example: In this case, URL becomes http://localhost/client/site1 and after virtual host implements then URL becomes http://site1.dev. Now, you can decide which one is easy to use.

Using virtual host, you can load assets from the root of your document without any movement of your site files.

There is nothing wrong with setting up Vhost on your local machine.

How can we Setup Virtual Host?

Here we need to deal with these important files.

• httpd-vhosts.conf file located under {xampp folder}\apache\conf\extra
• Window Host file located under C:\Windows\System32\drivers\etc

Let me start with httpd-vhosts.conf file, which is apache virtual host configuration file. To create a virtual host for your website, you need to add your code in this file.

<VirtualHost site.dev>
    ServerAdmin webmaster@site.dev
    DocumentRoot "D:/xampp/htdocs/site/public"
    ServerName site.dev
    ServerAlias site.dev
    ErrorLog "logs/dummy-host2.site.dev-error.log"
    CustomLog "logs/dummy-host2.site.dev-access.log" common
</VirtualHost>

As you can see in the above code, we have ServerAdmin, DocumentRoot, ServerName, ServerAlias, ErrorLog, CustomLog.

• ServerAdmin: Email address that the server includes in error messages sent to the client.
• ServerAlias: Alternate names for a host used when matching requests to name-virtual hosts.
• ServerName: Hostname and port that the server uses to identify itself.
• DocumentRoot: Directory that forms the main document tree visible from the web.

Almost done, as we have made changes in httpd-vhosts.conf files please save it.

Now, it’s time to tell the browser how to handle your new server name. So please open the windows host file. It’s located in this given path C:\Windows\System32\drivers\etc\hosts

Here’s you can add your host, as like given below:

127.0.0.1        site.dev

Like above, you can add as many as your hostname for local websites.

Note: If you are not able to save the host file, due to the permissions. Then you can try another way to save the host file. First, copy your host file and save this to another location. Then edit your host file, add your new host as required in this file then save it. Now, new host file ready to replaced with the windows host file. Please make one copy before editing as the backup of the host file.

Now, Restart your Apache and visit the site using URL http://site.dev

Please check back our other post.

If you like our content, please consider buying us a coffee.
Thank you for your support!
Buy Me a Coffee