Skip to main content

Part 3 - Prerequisites to setup your domain

Now that you finished Part 2 - Installing Linux Apache, MySQL and PHP (LAMP) on your VPS, technically you already have a working website.

However, looking at a standard Apache landing page is hardly invigorating. We want to be creating our own site - or sites - you can have as many as you want!

In Part 1, we set up our domain and one subdomain (which I named demo). This means that after we finish this tutorial, we will have two separate websites under one domain. Let's get things ready for both sites.

Creating the directory structure


In Ubuntu, the standard location for storing websites is /var/www. This will contain one folder for each of your websites.

At any point in time you can list which folders you have added (with "ls" you can list the contents of any folder):

ls /var/www

Right now only the default site is listed as the folder "html".

For your main site, create a folder that describes its purpose the best. In my case, I went with techmain. It doesn't matter what you name your folder, no one will ever see it except you. Some prefer to use their domain url instead of a description. There is no right or wrong here!

sudo mkdir -p /var/www/maindomain

We need to create a separate folder for our subdomain (or for any site you add in the future). Again, keep it as descriptive as possible, such as the purpose or url of your subdomain. In my case I wanted a demo subdomain, so I chose techdemo. Again, it does not matter what name you choose - as long as it makes sense to you and you keep your naming consistent throughout.

sudo mkdir -p /var/www/subdomain

Now we have the directory structure for our files, but they are owned by our root user. Instead, we want yoursiteusername to own the sites. Make sure you are logged in as user that is going to maintain the site, then type:

sudo chown -R $USER:$USER /var/www/

Next, we want the public to be able to view our websites:

sudo chmod -R 755 /var/www

Now all our sites should be visible to the world - but wait, there is still more to do.

Virtual host file for the main domain


We now need to create a virtual host file for our domains and subdomains. Create a new file:

sudo nano /etc/apache2/sites-available/domain.conf

For your hostname you can pick any name you want, because only you will ever see it. It would make sense to use your domain name. I named mine techperplexed.conf.

Paste the following:

<VirtualHost *:80>
  ServerName techperplexed.ga
  Redirect 301 / http://www.techperplexed.ga
</VirtualHost>

<VirtualHost *:80>
  ServerName www.techperplexed.ga
  DocumentRoot /var/www/maindomain
</VirtualHost>

Replace all the parts in red to reflect your own domain name and the folder where your site is located.

If you are going to add a subdomain, keep this file open. Otherwise, save with Ctrl-O, Enter and exit with Ctrl-X.

Virtual host file for the subdomain


Now we need to do the same for the subdomain. Later, you can add other domains or additional subdomains in the same way.

Your virtual host file should still be open, use your arrow keys to scroll to the bottom. Then add the following lines:

<VirtualHost *:80>
  ServerName demo.techperplexed.ga
  DocumentRoot /var/www/subdomain
</VirtualHost>

Obviously you need to change the parts in red to reflect the subdomain you chose in Part 1!

This is what my host file looks like:


Save your file with Ctrl-O, Enter and exit with Ctrl-X.

Enabling host file


Enable your host file:

sudo a2ensite domain.conf

Enable mod_rewrite (needed for many packages):

sudo a2enmod rewrite

Lastly, now that we have our own, we can disable the default host file:

sudo a2dissite 000-default.conf

Restart Apache to reload the settings:

sudo systemctl restart apache2

We're almost there!

Creating demo pages


Before we delve into creating "real" websites, we should really check if everything went well so far.

To do this, we shall create a demo page for each of our sites.

nano /var/www/maindomain/index.php

Edit the name to match your own folder name for your main site, but you know that by now of course. Then paste:

<html>
  <head>
    <title>Test site</title>
  </head>
  <body>
    <h1>Well done! Your maindomain website is working!</h1>
  </body>
</html>

Save with Ctrl-O, Enter and exit with Ctrl-X.

Do the same with the subdomain:

nano /var/www/subdomain/index.php

Paste the following content:

<html>
  <head>
    <title>Test site</title>
  </head>
  <body>
    <h1>Well done! Your subdomain website is working!</h1>
  </body>
</html>

Save with Ctrl-O, Enter and exit with Ctrl-X.

You can now visit the link to your domain (with the above setup, both techperplexed.ga and www.techperplexed.ga link to my main site) and your subdomain (e.g. demo.techperplexed.ga). If all went well, in all cases you should see a big

Well done!


Well done indeed! On to Part 4 - Installing WordPress to set up your own site.

Comments