How to setup Virtual Host on XAMPP?

Question

I'm using xampp v7.2.29.

But I can't setup a Virtual Host(vHost). Here is my code:

apache\conf\extra\httpd-vhosts.conf

    <VirtualHost *:80>
    ServerName localhost
    DocumentRoot "E:\xampp\htdocs"
    <Directory "E:\xampp\htdocs">
        Require all granted
    </Directory>
</VirtualHost>


<VirtualHost *:80>
    ServerName local.demoapp.com
    DocumentRoot "E:\xampp\htdocs\DemoApp"
    <Directory "E:\xampp\htdocs\DemoApp">
        Require all granted
    </Directory>
</VirtualHost>

C:\Windows\System32\drivers\etc\host

127.0.0.1       locl.demoapp.com

I'm using the above code but getting this error.

Click to s see error

Answer 1

You made a typo error on your host file.

Since you used

local.demoapp.com

as your server name, your host file should be

127.0.0.1    local.demoapp.com

Answer 2

you can also follow this.

Input the configuration bellow: make sure to change your file location to DocumentRoot, Directory and change ServerName.

<VirtualHost *:80>
DocumentRoot "/Volumes/Storage/niamrox.dev/web/practice/batch_1_project"
ServerName habizabi.com
<Directory "/Volumes/Storage/niamrox.dev/web/practice/batch_1_project">
AllowOverride All
Order allow,deny
Allow from all
Require all granted
</Directory>
</VirtualHost>

After that restart your Apache Server by Xampp service.

Find your own pc IP address.

Then find and open host file. If you are windown user edit

C:\Windows\System32\Drivers\etc\hosts

If you are OSX / Mc user then open terminal and and copy paste the following code below 'sudo nano /private/etc/hosts'

at host file write your ip address and server name like bellow

192.168.1.2 habizabi.com

After that restart your apache server and browse the server name on browser. You will find the project there.

You can follow this tutorial for better understanding