Hi Guys! Working as a frontend developer I never came across some cool and essential stuff that was very obvious in web development. Deploying my own site is a whole new experience for me.

For learning the process of deploying an app. I registered on the digital ocean, where I've created droplets with Linux 22.04 machine. Now to serve a site I decided to go with the famous and old server that is Apache.

Followed this document to set up an Apache on a Linux Droplet.

Now by default Apache server will serve One site. If we need to host multiple sites we need to use a very famous concept i.e. virtual hosts.

The term Virtual Host refers to the practice of running more than one website (such as company1.example.com and company2.example.com) on a single machine. Virtual hosts can be "IP-based", meaning that you have a different IP address for every website, or "name-based", meaning that you have multiple names running on each IP address. The fact that they are running on the same physical server is not apparent to the end user. - Apache

There are mainly 2 types of virtual hosting

1. Name-based virtual Hosting
2. IP-based virtual hosting - For IP-based virtual hosting server should have multiple IP addresses

Name-based Virtual Hosting

There 3 sub-types of name-based virtual hosting

1. with subdomain (eg. www)
2. with Ports
3. With a directory (or reverse Proxy)

1. With subdomain -

Apache provides the default file path to /var/www/html and the required configuration files to access these files are available in /etc/apache2/sites-available

Prerequisites: We have bought a domain and pointed it to our server or exact IP address. To create a new subdomain, we need to create a subdomain in the digital ocean. Follow this article to add a DNS entry for the subdomain.

• Now let's say we have domain jrdeverloper.online here. We already added an A record and pointed to our server's IP address. Now all the subdomains we want to create should be added in domains sections of the digital ocean, by pointing to our server's IP address/droplet.

• Create new .conf in /etc/apache2/sites-available using the below command cat /etc/apache2/sites-available/000-default.conf > projects.jrdeveloper.online.conf

• Here we are keeping the file name as our site name. The above command will duplicate the content of 000-default.conf file to projects.jrdeveloper.online.conf.

• Now we need to update the configuration in it. Open projects.jrdeveloper.online.conf nano projects.jrdeveloper.online.conf and change ServerAdmin, ServerName and DocumentRoot as given below

• Now if you see closely we have given DocumentRoot path as /var/www/projects.jrdeveloper.online. Navigate to /var/www and make a directory with site name. And create index.html file in it.

• Now we need to enable the site with the following command:
  a2ensite /etc/apache2/sites-available/projects.jrdeveloper.online.conf This will enable this site and will make a symlink in sites-enabled folder.

• After updating this we need to restart the server to apply the changes.
  systemctl reload apache2

• Now if we navigate to the projects.jrdeveloper.online, it will show that index.html page.

• The same steps can be followed for multiple subdomains.

2. With Ports

By default, Apache allows 80 and 443 ports. If want to support multiple ports except these two then we need to listen for those.

• Here we will add one more port 9000. To make apache listen to this port update the apache configuration file for ports i.e. ports.conf inside /etc/apache2
• Add Listen 9000 in this file.

• Note: If you have enabled the firewall then we need to allow this port from the firewall as well otherwise all the requests will be blocked by the firewall.

• To enable this port from ufw firewall. Follow below step
  ufw allow 9000
ufw reload To apply changes

• Now follow the same steps as the subdomain but here the difference is we need to add .9000 while listening for the virtual host like below

3. With subdirectory

Follow this article for subdirectory or reverse proxy based routing

So in this way, we can host as many sites as we want on the same server or same IP, as long as our server can handle the requests.

Stay tuned for Nginx!