Back in 2008 I started my first blog. Its original incarnation was a WordPress site hosted on Bluehost. I’ll never forget the countless hours I spent wrestling with WordPress plug-in updates, sweating my database back-up process, fighting the content editor to produce valid markup and, on at least one occasion, losing several hours of work as a result of clicking the wrong button somewhere. WordPress was complicated and it sucked.

WordPress was complicated and it sucked.

Since then, we’ve seen tremendous innovation making websites easier than ever to create and maintain, not to mention allowing them scale to the moon for mere pennies. No, I’m not talking about a series of hacks on hacks, but instead solid Web engineering practices which make the Web fun again.

Before I go any further I want to lay down the Hack Cabin architecture for you and explain a little about what makes it unique.

Site architecture

Here’s a quick rundown of the stack:

That’s the high-level. Now let’s briefly dive into each one to understand the advantages.

Generator

I chose Hugo for one reason alone: Speed. Hugo is the only popular static site generator without any dependencies capable of generating one-thousand pages per second.

Why choose a static site generator? Because static sites are the only reliable way to cache content in the browser, allowing pages to load faster than the blink of an eye, worldwide on just about any device imaginable. Just try and do that using a CMS or React site without tearing your eyeballs out, I dare you.

Theme

For years I’ve been using off-the-shelf themes made by someone else. Most have been free or open source, but they always felt foreign and never as close to home as After Dark, which I created and open sourced specifically to create Hack Cabin.

Besides its vaporwave appeal, After Dark eases nighttime reading and allows anyone using it to hit sub-second page renders right out of the box – no tedious grunt work required.

After Dark has the ability to serve up an entire page (including favicon) using a single HTTP request. And when you’re targeting mobile users, where individual HTTP requests can take upwards of 100 milliseconds, every little bit counts.

Hosting

In the past I hosted my websites on DigitalOcean as I thought $5 a month was cheap. Then I started using) AWS S3 and CloudFront and learned, not only did I save the administrative headache of managing a Linux VM in the cloud, I could save nearly 80% on hosting costs using AWS over DigitalOcean. And with AWS I was able to pick up this domain name at $12/year using Route 53 in just a few short minutes.

I saved nearly 80% on hosting costs using AWS over DigitalOcean

If you’re not familiar with CloudFront, it’s simply a CDN like CloudFlare, only it gives you significantly more flexibility and power, and some will point out security as well. Not only does CloudFront integrate with S3, upon moving to it I saw AsiaPac traffic pick up like never before. 你好

Content editor

There’s little need to get into the awesomeness of Markdown and how elegant it makes writing for the Web, but I would like to touch on why I chose Atom over SublimeText. After using Sublime for five years it took a few pairing sessions with a younger developer earlier this year to help me see the light and make the switch. What with its stellar GitHub integration and sexy interface, Atom is just a damn pleasure to use – something I could never say about SublimeText.

Source control

One of the benefits of working with static websites over a traditional CMS is that content doesn’t get buried in some hard-to-reach database table. Instead, content is stored in plain text along with your code, allowing it to be version controlled – making post authoring, revising and editing much easier, and also helps prevent accidental deletion of content.

For several years I was using GitHub for source control, but I’ve decided to switch to Gitea shortly after becoming aware of it. The immediate benefit I see to using Gitea is that it allows me to host my source code privately without paying the $7 monthly fee GitHub charges for hosting private repos.

Deployment

I learned about s3_website after reading a blog post from one of the founders of CloudCannon, a cloud-based content editor for Jekyll. I tried it out of need at the time, but holy shit I’m glad I did. Using s3_website makes setting up a website using S3 and CloudFront a command line affair. Once set-up, and combined with Hugo, I can generate the code for an entire website and deploy it to S3 and CloudFront in only a few seconds. Done and dusted.

Backend

I’ve never been comfortable managing backends. They’re complicated, they’re wasteful and they require a lot of maintenance. Whats worse, backends are typically decoupled from the front-end, giving you a chimera of a site to maintain and a major coordination headache due to tight coupling.

With Serverless and BaaS offerings like AWS Lambda, however, the backend code can be checked in right alongside a static website and deployed with ease using Serverless. And I like easy.

Time to fly

Welcome to Hack Cabin, one of the fastest and most accessible websites on the planet. I will use Hack Cabin to share tech, finance, dating and travel advice as I take to the skies in search of what’s out there in this big wide world.