A Modern, Retro Blog Workflow

I recently experimented with moving this blog from WordPress to a simpler system in Tumblr. However, this setup never felt great and still felt “overtooled” for the task at hand.

Like many who got their start in the age of FTP, HTML4 and CGI there has always been a part of me that wanted to get back to those simpler times in web development. Were they actually simpler times? I don’t know, but I feel like there were definitely portions of things that required a lot less npm, webpack, scss alphabet soup tooling to publish some text.

I tried offloading this all to Tumbler but then I felt like I lost too much control. So to find something that was A. simple, B. under my control, you know like FTP and HTML files, but better. I started to poke around at static site generators and saw Hugo mentioned several times.

Hugo

Hugo is a GO based static site generator. After having a colleague introduce me to a GO based minifyer that was blazing fast, I was intrigued about using GO for site processing.

🚀 I’ve successfully replaced webpack with a golang script and it is 🔥fast🔥

(This mostly only works in my specific not-modern-js context 😂)

— Chris Fidao (@fideloper) May 19, 2020

So I decided to at least download HUGO and give it a try.

The demo experience was extremely nice. I was able to get a demo site up and running with Hugo’s built in server in minutes. It was easy, no dependency hell, just run an executable… this was a good sign.

I started trying to write a test post and tweak the default template. Posts can be written in Markdown or HTML and are a file that you place in the content/posts/ folder. Imagine that!

The template code of HUGO is HTML files with the addition of variables and functions in GO. Go Template variables and functions are accessible within {{ }}. Since I have never worked in GO before the syntax took a sec to get used to, but by my second night of playing around with it I had written my own basic template for my needs.

This is the first template that I have written from scratch in a while. And as such, it has zero JS and a very simple CSS file based on new.css a classless css framework.

Deployment

So up until this point all of my development was done locally with a watching command line job rendering my site live in the browser as I made changes. Pretty similar to local development a long time ago, no docker, no VMs, just a text editor, my browser and a simple web server.

Well eventually this thing had to go somewhere. I had options I could literally just build locally and FTP the files up to a web server. This felt a little too old school. With only a small bit of poking I found https://render.com that has a very simple build integration with Github. Best of all, for low traffic situations (like this blog) it’s free!

I use git in my work every day so integrating git into my blogging workflow was comfortable for me. In addition using Github would allow me to use mobile git apps, web apps, the command line and desktop GUIs to control publishing.

The setup on render was pretty painless. Hugo provides a guide here https://gohugo.io/hosting-and-deployment/hosting-on-render/. In a few minutes I had a site working on the public internet, you know kind of like the good ol’ FTP days.

If you are reading this now, you’re reading a HUGO site that I’m running for free with no JS, no DB a simple publishing workflow. It’s kinda fun… I think I like it.

Leave a Reply

Your email address will not be published. Required fields are marked *