A step by step tutorial.

Hugo is an easy, open-source static web generator, with which you can generate your own blog/website based on dozens of out-of-box templates.

To begin with, follow the official tutorial first, nothing special. After all these, you will hava a website hosted on your localhost:1313 looks like this:

Don’t worry if the interface looks naive, there are lots of templates available here, pick up one and try to modify it according to your own preference.

Now we are able to hosr our own hugo website on localhost, but this is not what we really want. Hugo officially support a lot of host methods. In this post, I will choose to host on the Github Pages. There are three different ways to host your hugo website on github pages, and I prepfer to the first one – deploy it via /docs folder on master branch. The official docs is rather abbreviated, you can use the video below as your reference. The main content begins from 11:00. BTW, you can choose to either add the /publish folder into .gitignore file using:

echo "public" >> .gitignore

or just delete it.

You may have noticed that every time you add something new to the your website, you have to go through a lot of git commands in order to push it into Github, which can be a bit painful. To ease this procedure, you can make a shell script to help you. E.g., below is a light-weight script I made:

#!/bin/sh
cd /Users/tonysu/Desktop/Tony_Blog
hugo
git add --all
git commit -m "update blog"
git push
echo "Finished!"
exit

You need to get a git ssh key ready before pushing your website into Github, however, by this mean, your commit message will always remains same, in this case, it’s “update blog”. This is bad for VC, you can either adjust it manually everytime before you push a commit, or do a litte modicication like this: