This post is about setting up virtual hosts on your machine. Whether you've installed XAMPP or WAMP your urls when developing web apps on your machine will look more like so:
By the end of this post we will cover how to convert the above to any domain you want it to be. For example, converting it to
www.virtual-hosts.tm. Now let's get into it.
Windows host file
To redirect your "so called" urls to your local machine you need to first add them to the .host file:
- Go to your host file located under
C:\Windows\System32\drivers\etcand open it using notepad. Run as administrator
- At the end of the file add the following line 127.0.0.1 www.yourdomain.com
- Save your file
Let's add a virtual host inside your
httpd-vhosts.conf file. I've installed xampp on my computer:
- Locate your vistual hosts file under
- Open the file and add the following:
NameVirtualHost *:80 <VirtualHost *:80> ServerAdmin firstname.lastname@example.org DocumentRoot "C:\xampp\htdocs\yourprojectfolder" ServerName www.yourdomain.com </VirtualHost>
- Save your file
When defining a virtual host you will always have to add
NameVirtualHost *:80 at the beginning. Apache will look through your
<VirtualHost> tag for any your "so called domains". The
ServerName has to be the same as the domain you put on your host file. The
DocumentRoot is your project under your htdocs directory. The folder you put there has to have some index page.
Now restart your server once you've made the changes. Make sure you follow these instructions to the precisely. If you forget to even put a closing ">" your server will not start so be careful when you type this. Should you encounter any errors when starting your server you will have to check the log file under
C:\xampp\apache\logs and open
Restoring your control panel
If you've installed
XAMPP like I have you might notice that when you've made the changes to the
httpd-vhosts.conf file and you type
http://localhost on the browser's address bar, you will be redirected to your application. Don't panic! This is because your domain points to the same IP address as XAMPP's the control panel address. So since there is no specific virtual host definition on the hosts file that points to the control panel's
DocumentRoot its using the one you've defined. If you want your control panel back then you have to create a virtual host for it too. This is the implementation:
NameVirtualHost *:80 <VirtualHost *:80> ServerAdmin email@example.com DocumentRoot "C:\xampp\htdocs" ServerName localhost </VirtualHost>
This will restore your control panel when you type localhost.
That's it. We have created our virtual host. You can create as many as you need and remember to be extra cautious when touching the virtual hosts config file inside your apache folder.