Creating Virtual Host in Ubuntu 20.04 LTS

vHost.sh

# Following is the step-by-step guide on 
# how to add a virtual host in your dev machine

# This tutorial is for the Apache Server only.

# Please note that Virtual Host can be created only
# of the /var/www/html directory.
# If you try to create a virtual host of any other directory
# you will get Forbidden error.

# Open up terminal and cd into the html folder
cd /var/www/html

# Create a project folder inside /var/www/html
# and cd into the folder.
mkdir new-project; cd new-project

# Create a new file called index.html and add the basic html content
# and then save the file.
# nano is editor, you can use sublime, code, vim, whatever you want
nano index.html

# Now, we need to create a configuration file for the virtual host
# Therefore, open terminal and cd into the sites-available directory
cd /etc/apache2/sites-available

# You can simply copy the 000-default.conf file that comes 
# with the Apache installation. To do that, in your terminal:
cp 000-default.conf domain-name.conf
# Don't forget to replace the domain-name with your project-name

# Open the domain-name.conf file in your favorite editor
# I'll go with nano for this example
sudo nano domain-name.conf

# Replace/Add the following lines
ServerAdmin webmaster@localhost
ServerName domain-name.test
ServerAlias www.domain-name.test
DocumentRoot /var/www/html/new-project

<Directory /var/www/html/new-project>
    Options Indexes FollowSymLinks MultiViews
    AllowOverride All
    Order allow,deny
    allow from all
    Require all granted
</Directory>

# Once you have replaced/added the above lines, save the file.
# Now, you need to enable this new virtual host.
# To do so, in your terminal, fire the below command
sudo a2ensite domain-name.conf

# The configuration part is over.

# Now, we need to add the domain-name.test url in the hosts file
# Failing to do so, will give a site not found error.
# Because the browser will try to access the site domain-name.test
# over the internet, while it actually resides on your local machine.

# Open the hosts file with your editor
sudo nano /etc/hosts

# add the following entry
127.0.0.1   domain-name.test

# Save the file and restart the apache server
sudo service apache2 restart

# Now navigate to the domain-name.test in your browser
# You will see the rendered content of index.html file.

# CONGRATULATIONS !!! You have successfully added a vitual host
# in your system.

# HAPPY CODING...