How to Setup A Virtual Host with Xampp web Server
Xampp is a free and open source cross-platform web server solution stack package, consisting mainly of the Apache HTTP Server, MySQL database, and interpreters for scripts written in the PHP and Perl programming languages.
XAMPP’s name is an acronym for:
- X (to be read as “cross”, meaning cross-platform)
- Apache HTTP Server
Xampp which is used as a local host to run your site locally and test it as well. Now, talking about the problem which you might be or are facing is that whenever you are running any site on localhost, your domain name will be somewhat like this http://localhost or http://127.0.0.1 or http:// localhost/yoursite. Also when you are migrating your website on a cloud server you might face a problem with the connection. You might be thinking that can’t we use a custom domain in a local host? Well, the answer is Yes! Ofcourse you can do that.
Step 1: Modify The Windows Host File
The windows’s host file is a simple plain text file which connects your hostname with the ip address. For Windows the location is C:\Windows\System32\Drivers\etc.
Now we will make an entry into this file which will map our custom domain with 127.0.0.1 . This 127.0.0.1 is an ip address also known as a lookback address of every computer. This is a special ip address which is used in every pc.
Now before editing this file take a backup of this file.
After opening this file, add the following line at the bottom of this file :
127.0.0.1 yourwebsite.com. Save and close this file.
Now your host file will look like this:
Now whenever you open your domain in a web browser, your domain connects to the ip of your pc and not the internet because we have mapped it to 127.0.0.1. Hope you understood.
Step 2 : Modify Apache virtual host File
While editing your httpd-vhosts.conf file take care that your xampp server is off. Don’t worry if it is ON, you can just shut it OFF or Stop it. You have to do this because only after this you’ll be able to access the virtual host otherwise not.
We can make many local sites with the help of Apache’s virtual host and also can serve with the help of custom domains on online basis.
Now navigate to C:\xampp\apache\conf\extra and in this folder you will see a file named httpd-vhosts.conf and to edit this use any plain text editor like notepad, notepad++ or Sublime text and add the following at the end of this file.
The above line is important because we wont loose the htdocs folder. So, now we are ready to edit the virtual host.
Now add the below mentioned line after adding the above lines.
1. DocumentRoot is the root directory of your website where you have added your website’s every html, css and js files.
2. ServerName is a custom domain which you have added in the host file of windows.
At the end your file will look like this:
In this way you can use many local websites with custom domains.
So, now let us see how you can add more websites to this and how it’ll look like.
With This You can access your local website with a Domain name that you specified in Host File.