{ Michael Gale } | Web Developer - Melbourne, Victoria

A Static Site Journey

Wrangling my mess of a website with HUGO

I recently tweeted about how I make a new theme for my website almost annually. It’s a trend I’ve wanted to shake for a while. It doesn’t make me more productive, it doesn’t make my content any better - and a lot of work goes into what you might argue has had a very low return on investment. My blog-writing hasn’t been consistent, so the website doesn’t attract views that way - and I haven’t really used it to attract potential freelance clients either. I did, however, use the website during various job interviews as part of the laborious process of moving interstate from NSW to Victoria, earlier this year. So that’s something.

I mentioned in the tweet that my next design was going to stick - a proclamation that comes from a place of acknowledgement. I tend to get caught up in minute details when I’m working on projects, and I need to take care that I’m not letting core features slip away. I think a writing project really needs to be fun and achievable in the long term. I’m not sure how many times I’ve iterated over my designs, but if I were to go off my patented Cocktail Semver list, I’d have to guess we’re up to a Manhattan, or a Cosmo.

Minimal Viable Product

A minimum viable product (MVP) is a product with just enough features to satisfy early customers, and to provide feedback for future product development. (Wikipedia)

Maybe I’ll bore you with the history of my website builds another time - for now, I’ll just dump this list of ideal features for my website:

  • Headless, transparent “CMS”
  • Markdown for content
  • SPWA style navigation
  • Continuous integration
  • Content/data driven
  • SEO friendly
  • Responsive, accessible and performant
  • Thoughtful, future proof design
  • Modular + build tool agnostic

Making this list has taken several years, several attempts to start writing, and a lot of failing. I needed to make the wrong thing several times in order to learn what was most important for me - in a presentational sense, but also in terms of workflow. Out of everything in the list, I think the only thing that I’d need to start shipping my ‘product’ is Markdown. I could just type an article in anything that supports plain-text, export it as HTML and throw it on a server. I’d have the same amount of visibility as I do now, plus I’d get practice writing, and there are no complicated build steps.

The rest of the list is probably just ego. And so it goes.

An annual refresher is kind of cool though. It can be an opportunity to try out some new tech or to fix problems you didn’t previously have the skills or motivation to solve. It takes a lot of time, but I try to use iterating on my website as an opportunity to learn some valuable skills and apply some things I want to show off.

You know what, no, lets go there for a second

And that may be key. In my last iteration I defined some core features, but the real goal was to push myself into learning new concepts like using a headless CMS, decoupled from the front-end - a more vibrant and colourful theme, playful content and of course, an experiment in building the front-end with React JS.

That project was

  • Fun ✔️
  • Learning experience ✔️
  • Showed off some skills ✔️

But ultimately, it wasn’t easy to come back to because I don’t spend my day-to-day in the React space. A lot has changed for me in the past year through the help of other inspiring people - I’m of the opinion now, that I’m incredibly employable without React - just by virtue of my experiences and sheer problem-solving determination, skills that I think are more fundamental than any hot mess of a framework.

Moreover, that website wasn’t all that fun to keep up to date, and even though using the headless CMS was an improvement over say - WordPress (my other defacto), for me it feels a bit too slow and laborious to open up the browser and click around the different feels - when I know in the back of my mind there are much easier ways to get content onto the web.

Dealing with the real problem(s)

I think there are a few reasons why I can’t seem to stick to my blogging. I think these might be kind of common, so I’ll try to break them down a little bit.

1. Imposter Syndrome

Firstly, for myself as a developer with only a small amount of formal training - it has been a quiet concern for me that if I’m blogging about code, I’ll be showing off some inherent lack of skill, or I’ll miss some important detail, or I’ll help someone pick up a bad habit. This sucks because again - I need to be able to fail in order to grow. It holds me back in more ways than just blogging. I’ve struggled with interviews, working on open-source projects, and initially I was nervous to show off anything in Codepen (most of my stuff is flagged with a Work In Progress tag, just to be safe).

I’ve found that articles by folks like Chris Ferdinandi, a little mindfulness, and the slow progress of time have helped me with all of this.

So that’s problem number one, and to get around it - I’m just going to go full steam ahead for a minute - and see where I end up!

2. Time

I could never get my head around how people have so much time up their sleeve - and this is probably worth a whole topic of its own - but I’m making extra time for myself simply by going to bed at a consistent time and waking earlier. 5.30AM is an amazingly quiet time, perfect for clacking away on a mechanical keyboard, for example.

3. Topics

In most of my adult life I have struggled to find a balance between “lazy” and “perfectionism”. That’s because I know doing something of high quality can be incredibly rewarding - but takes hours and hours of work. I have thrown myself into a lot of projects with 100% commitment and experienced burn-out.

It’s daunting to be starting from nothing and trying to come up with original content. Stories that everyone hasn’t heard a million times. It’s hard to come up with a topic that I think hits a sweet spot between just one paragraph and a huge essay. Sometimes I struggle to just pick an angle on something.

I think the more blogs I read - the more I see the person in their writing, and the more comfortable I feel to express myself on a given topic.

4. Workflow

I want the right balance of ease and speed. It needs to be as simple as possible to create new content or I won’t end up doing it. I think I’ve landed on something I can really get behind with HUGO. Maybe you’ve heard of it, or are wondering about all this “JAMstack” business. Maybe you’re already convinced by its benefits and using it daily. Maybe you got to the point where your entire blog was working, but you can’t quite figure out how images are meant to work. Yeah, me too. But we’ll get there.

Conclusion

Going back to the MVP list, I think I can sum up all of my ideal features with one line of bash:

hugo new posts/my-new-post/index.md
  • Headless, transparent “CMS” ✔️
  • Markdown for content ✔️
  • SPWA style navigation ✔️
  • Continuous integration ✔️
  • Content/data driven ✔️
  • SEO friendly ✔️
  • Responsive, accessible and performant ✔️
  • Thoughtful, future proof design ✔️
  • Modular + build tool agnostic ✔️

You can’t get much more transparent than no CMS at all.

I will sign off by saying that all of this journey has come from a place of desperately wanting to talk about my move. So I’ll link that post once more. That desire to express myself through content and feeling like I didn’t have the perfect tool to wrap around that content and bring it online is what inspired this learning journey. It’s what kept me watching tutorials until I figured out my MVP. And it inspired this post too.

More to come!

MVP: Deploy some markdown as html to a server