How I started this blog using Hugo and a Linode instance _{<-- Link to original page}

Hi! Firstly, welcome to my website! I try to maintain it regularly and improve it as much as possible, adding and removing features on my server when I feel like it. Recently, I realized I missed writing about things that interest me, which I would typically do in college quite a bit, but now that I'm out of school finally, I haven't had much of a chance to divulge my thoughts anywhere and let others read them. For me it's pretty relaxing just putting your thoughts down, or in this case, writing a tutorial for others to follow and help out with.

Well, that's where this blog comes in. In case you're willing to stick around, I've likely got other posts as well, so feel free to check them out, you can navigate to the home directory at the bottom of this page. And please, leave a comment telling me how cool and/or dumb I am, too ;)

And with that, onto the installation guide!

Prerequisites

Secondly, you're gonna need to have some things already setup. You will need:

• A Linode server running either Debian 10+, or Ubuntu 18.04+
• Ensure that your server is secure as well as your Linode account.
• Setup Apache2, PHP, and MySQL to start hosting websites.

Optional Prerequisites (but recommended)

• Domain name for your server. I recommend epik.com as they are well maintained, accept Bitcoin as payment, and take privacy seriously since each domain comes with Whois privacy enabled automatically.

---

Register your website with Apache {#register-w-apache}

Before you do anything, you should configure your website for Apache to register your website with later.

cd /etc/apache2/site-available;
nano yourwebsite.com.conf

<VirtualHost *:80>
  # Admin email, Server Name (domain name), and any aliases
  ServerAdmin [email protected]
  ServerName  yourwebsite.com
  ServerAlias yourwebsite.com

  # Index file and Document Root (where the public files are located)
  DirectoryIndex index.html index.php # can be customized to be any configuration you want
  DocumentRoot /var/www/html/yourwebsite.com/public_html # also customizable
  # Log file locations
  LogLevel warn
  ErrorLog  /var/www/html/yourwebsite.com/log/error.log
  CustomLog /var/www/html/yourwebsite.com/log/access.log combined
</VirtualHost>

Then, you should create the folders you specified within the configuration file. We won't be creating /public_html just yet, as we will be using symbolic linking for that folder instead later in this guide.

sudo mkdir /var/www/html/yourwebsite.com/{log,backups}

---

Install Hugo

• Install Homebrew if it isn't on your server already.

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)";
sudo apt-get install build-essential;
echo 'eval $(/home/linuxbrew/.linuxbrew/bin/brew shellenv)' >> /home/user/.profile;
eval $(/home/linuxbrew/.linuxbrew/bin/brew shellenv);
brew install gcc

• Install Hugo with Homebrew in a folder of your choice. I ran into issues when installing outside of the desired folder I was going to host the blog in, so choose which folder you will run your website from and then install Hugo with Homebrew.

cd
brew install hugo

• Create a folder that will hold your Hugo website. You can create it anywhere, for instance, create it within the current logged in user's home folder.

sudo hugo new site hugo-site
cd hugo-site

---

Install a theme (optional)

• Install a theme of your choice from https://themes.gohugo.io/
  I used Cactus by Zeran Wu.

cd themes
git clone https://github.com/monkeyWzr/hugo-theme-cactus.git cactus

• Further instructions should be available with each theme. The only file you need to typically edit is config.toml, which is used to configure your website's theme and content. Consult Hugo's documentation if you get stuck or want to go beyond what the theme says can be edited.

You can also completely revamp or adjust the theme if you want by editing it's code directly (for more advanced users only). Again, consult Hugo's documentation if you wish to do this.

---

Build static pages

• Go to the folder that you created your new site in

cd ~/hugo-site

• Build your pages.

hugo

And that's it! Your website is now built and can be served through /hugo-site/public

• To set a custom directory, set publishdir in the config.toml file.

echo publishdir = /your/dir/here >> config.toml

---

Serving Your Blog with Apache2

There are several ways you can serve your website. All of them have to do with how you choose to configure your directories. For instance, you could simply set a custom directory as outlined above, or you can use symbolic linking to create a psuedo directory which points to the actual directory somewhere within your file system. And since Linux is built around everything being files, this works just fine, so we can safely create a symlink folder that will serve your website within Apache's default folder.

• First, enable your site

sudo a2ensite yourwebsite.com.conf

• Now, navigate to where you plan to serve your files. /var/www/html/ is Apache's default directory, but you can choose the directory by customizing it within /etc/apache2/sites-available/yourwebsite.com.conf

cd /var/www/html/yourwebsite.com

• Create a symlink folder, public_html, that links to the static pages that Hugo created within hugo-site/public:

sudo ln -s /var/www/html/yourwebsite.com/public_html ~/hugo-site/public

We called the folder public_html because that is what was specified in your website's Apache configuration file (/etc/apache2/sites-available/yourwebsite.com.conf) under DocumentRoot.

• Finally, restart Apache

sudo systemctl restart apache2

---

Secure your site's traffic with Let's Encrypt

While SSL/TLS (https://) isn't exactly required here, it's never a bad thing to add to all your websites. It creates a sense of trust between your users/audience, and also gives you flexibility later in case you want to add more sensitive features to your website and how it works.

For Hugo, one reason I can think of adding an SSL certificate is that if you ever decide to turn on comments to your website, those forms and logins that might be required will be secured in case those third-party extensions aren't already utilizing secure traffic flow.

• First, install the certbot module if you haven't already.

sudo apt install certbot python3-certbot-apache

• Run the certbot module and follow the on-screen prompts, select only the websites you wish to have SSL enabled for.

sudo certbot --apache

Let's Encrypt certificates expire after 90 days. Within 30 days of expiration, certbot should already be configured to renew your keys automatically every two days thanks to a cron script that was configured on install.

• Ensure this script is actively configured and running with:

sudo systemctl status certbot.timer

• You should get something similar to:

certbot.timer - Run certbot twice daily
   Loaded: loaded (/lib/systemd/system/certbot.timer; enabled; vendor preset: enabled)
   Active: active (waiting) since Fri 2020-08-07 22:27:17 CDT; 1 weeks 1 days ago
  Trigger: Sun 2020-08-16 21:59:19 CDT; 3h 41min left

• Test out the renewal process with:

sudo certbot renew --dry-run

This should run through the process, with making any actual changes to your SSL certificates, and will report any problems if there are any.

---

Posting

Now it is time to create a post. I won't go into all the ins and outs on how to write a post. That, again, is all outlined within Hugo's documentation. But to simply initialize a post run hugo new posts/post.md.

Rebuild the static site with hugo to update all changes when they are made.

Initially, the post will have "draft mode" enabled and will not show up when you rebuild your website. Set it false and rebuild for the post to render on the live site.

nano ~/hugo-site/content/posts/post.md

---
title: "How I started this blog using Hugo and a Linode instance"
date: 2020-1-1T12:00:00-04:00
draft: **false**
comments: true
tags: ["blogging", "tech", "cooking", "mlg-hoola-hooping"]
---

And that's it! Hopefully this was a huge help for those having trouble getting started. Let me know in the comments below if this tutorial was helpful to you and feel free to shoot some questions my way or if there is anything wrong with this guide at all.

Happy coding!