Index | Me | Site | Blog | Tech | Links | Media
Last Update: 2024-03-06 19:55 UTC+0

Getting Started with VPS Web Hosting

Back

Setup VPS

I've previously argued that setting up a personal website is a rewarding experience which offers significantly more possibilities than using social media. While there are free and beginner-friendly services such as Neocities, nothing beats owning your server and the software stack behind the website.

In this guide, I'll be covering the basic steps to get a functional web server up and running on a virtual private server (VPS) with a custom domain.

VPS providers will usually charge a monthly fee, but for the purposes of running a small personal website, a basic plan costing no more than a few US dollars (or your equivalent currency) will be more than sufficient.
For this guide and subsequent parts, I'll be using Vultr which this website is hosted on. There are cheaper providers out there, but Vultr has always been reliable and is easily scalable.

Namecheap is my domain registrar of choice as their pricing is reasonable and they offer free domain privacy - meaning that your personal details associated with the domain can't easily be looked up.

Once you have purchased a domain name & registered with a VPS provider, you'll want to deploy a new server.
On Vultr, select a Cloud Compute config. Initially, you shouldn't need a lot of processing power, RAM or storage. This website runs on Vultr's cheapest config. Debian is my go-to server OS, so all commands in this guide apply to a typical Debian/Ubuntu environment.

After deploying the VPS and giving it a few minutes to install, you'll be able to find the IP & root login details in its console. Many VPS providers also offer a browser-based remote access solution such as noVNC in Vultr, but I'll be using SSH throughout my guides.

SSH Into Your VPS

SSH onto your server with ssh root@[YOUR-IP]. You will be prompted to add the server to your computer's list of known hosts.

You will now be in your server's shell session. You can verify the system's details with uname -a
Run a full system update with apt update && apt upgrade followed by reboot to restart.

After rebooting the server, create a new non-root user, which will be the account handling all of the website's files later.
useradd -s /bin/bash -m -G www-data [username] creates a new user, provisions a home directory and adds the account to the www-data group.
Set a password with passwd [username]. On Linux you won't see any passwords as you type them.

Install Nginx

Next, install Nginx with apt install nginx. This is the web server software which will be hosting the website.
Start Nginx with systemctl start nginx.service
Enable the service to launch at system startup with systemctl enable nginx.service
You can view the service's status with systemctl status nginx

Firewall

Your server may come with a firewall such as ufw.
You can identify Nginx firewall rule profiles with ufw list | grep Nginx
Allow Nginx though the firewall for both HTTP and HTTPS connections with ufw allow Nginx Full

You should now be able to see the default Nginx page by navigating to your server's IP address via the web browser.

DNS

Next, you'll want to point your domain name to the newly created site.

In your domain's DNS settings, create 2 A Records.
The first one should have a Host value of '@', the second one 'www'. Both should point to your server's IP.
@ indicates the domain's root and www sets a www.[yourdomain] subdomain, which will make your website accessible by either navigating to the domain with or without a 'www' prefix.

+-------------+----------+-----------------+
| Record Type | Host     | Address         |
+-------------+----------+-----------------+
| A           | @        |    [YOUR_IP]    |
+-------------+----------+-----------------+
| A           | www      |    [YOUR_IP]    |
+-------------+----------+-----------------+

Web Directory

For your new site, you will want to create a web directory to store the HTML files.
Run mkdir /var/www/[yourdomain] (The Nginx test page is stored in the /var/www/html directory)
Run chown -R :www-data /var/www/[yourdomain] to make the www-data group the owner of the directory and its contents.
Run chmod -R 775 /var/www/[yourdomain] to grant the www-data group the necessary permissions.
At this point, you can create a test HTML file within the new directory with nano /var/www/[yourdomain]/index.html

Server Block

Nginx can host multiple websites on one web server. They're handled through server blocks found in /etc/nginx/sites-available/
Site server blocks are enabled through logical links (shortcuts) located in /etc/nginx/sites-enabled/

Create a new server block for your site. Its name should be your site's domain.
The default server block can be used as a template so copy it with cp /etc/nginx/sites-available/default /etc/nginx/sites-available/[yourdomain]

Edit the newly created server block with your text editor of choice such as nano with nano /etc/nginx/sites-available/[yourdomain]
We will be replacing a few values to point it to a new web directory and associate your domain name with it.

server {
	listen 80;
	listen [::]:80;

	root /var/www/demo;

	# Add index.php to the list if you are using PHP
	index index.html index.htm index.nginx-debian.html;

	server_name [yourdomain.com] www.[yourdomain.com];

	location / {
		try_files $uri $uri/ =404;
	}
}

The server block can now be enabled by creating a symbolic link with ln -s /etc/nginx/sites-available/[yourdomain] /etc/nginx/sites-enabled/
You can disable the default block with rm /etc/nginx/sites-enabled/default

Once the changes have been applied, verify the configs are valid with nginx -t
Restart Nginx with systemctl restart nginx.service

You should now be able to access your website via the domain name. Note that DNS changes can take a while to update.

The site will only be available through HTTP, so you will want to set up an SSL certificate. Certbot is a tool which provides free certificates.

HTTPS with Certbot

Certbot's official guide recommends installing it as a Snap package, but for a variety of reasons I'm not keen on using Snap.
The following instructions will set it up as an apt package.

Install Certbot with apt install certbot python3-certbot-nginx

Once installed, run certbot --nginx to run the setup script for Nginx.
You will be prompted to enter an email address for renewal notifications.
Next, you will be asked to read & agree to the terms of service.
Optionally, you can agree to share your email address with the Electronic Frontier Foundation for promotional reasons. This is optional.

After you carry out the initial registration, you will be presented with a choice to select which domains to activate HTTPS for; If you followed the above instructions, there will be 2 choices including your domain with and without a www prefix. Press enter without entering any numbers to select both domains.

A certificate will be requested and applied to your site.
Following this process, Certbot will automatically modify your server block to include all config necessary for HTTPS.

Certbot certificates are valid for 3 months.
Once the expiry date approaches, they can easily be renewed with the certbot renew command.

Upload Your Website

Now that the site is fully up and running, you just need to upload your HTML content.

If you want an easy graphical way of managing the web directory, I recommend FileZilla.
Log into your VPS using the previously created non-root account via sftp by entering sftp://[YOUR-IP] as the host and specifying port 22.
You can now navigate to /var/www/[yourdomain] on the remote site and upload your HTML as required.