How I created this website!

Dylan Clark

May 14, 2020

How I made this Website!

Hey, I’ll be honest, I tried to make this website multiple times, and every time was left feeling sad and alone with nothing to show but an angry git history. Eventually, after having read many an article, I did it. In doing so, I realised the many guides for setting up a simple static site like this one were often missing key information or significantly out of date, so here’s a little guide.

  1. Create your Hugo site
  2. Hook it up with Gitlab
  3. Get and configure your domain
  4. Sweet Sweet Victory

Hugo

Check out the gohugo docs for a quickstart guide. Feel free to use whatever static site framework you prefer, but ensuring it’s got a gitlab-ci template is a good idea (most popular frameworks will).

Gitlab

Next, it’s time to setup version control as well as hosting.
Once you’ve stuck it on gitlab, Click the CI/CD Configuration button and select the hugo template (or whatever css framework’s template you used). Ensure your site works on the pages url once it successfully builds.

Domains

It’s time to buy a domain! I used google domains for this since their .dev domains are so cheap and I’d recommend them for how easy to was. Once you have your domain you’ll need to add 2 rules. This is in the custom rules section of google domains.

  1. An A record pointing at the gitlab ip (currently 35.185.44.232)
  2. A TXT record with your gitlab pages verification code (can be found from the gitlab repo pages settings, when you go to add a custom domain)

And then you should be done! A static site hosted on your own domain with CI/CD, all for free (bar domain costs).