11ty & GitHub Pages - run personal sites for cheap

If the best programmers are lazy, are the best architects cheap? I kid, but today, I'll share how this site is hosted for $12 a year.

My requirements were simple:

1. quick & easy blog publishing (WYSIWIG not needed, but I don't want to author posts in HTML)
2. scores of 100 in Lighthouse categories of Performance, Accessibility, Best Practices & SEO
3. full control of my domain name and permalink URLs
4. web analytics (Google Analytics and CloudFlare)
5. custom code as needed with automated deployment
6. close to free as possible (what can I say — I'm frugal!)

Static site generation (SSG) is all the rage and for good reason: pre-generated web pages are simple, fast, server and client resource efficient, and portable for hosting. I started with Next.js with Static HTML Export deploying to GitHub Pages using GitHub Actions. That checked the boxes for requirements 3 through 6, but 1 & 2 were going to be a bit more work, so I went looking for alternatives.

Jekyll may be the most popular SSG, and it's endorsed by GitHub, but I just wasn't excited about brushing up on Ruby programming. Then I discovered 11ty. It was just what I needed! Here are some of 11ty's highlights:

• It's written in JavaScript. Bonus, there's a TypeScript starter on GitHub, but I haven't tried it yet.
• 'No code' in all the right places with support for a dozen template languages. I went with Nunjucks for site pages and Markdown for blog posts like this one.
• Robust support for collections, pagination, and permalinks — requirements 1 & 3, check & check.
• Development is fast! Blazing fast builds (0.2s for this site) with live reloading & minification. Requirement 2 just got easier.
• A slew of useful plugins. Since I want to support feed readers, I quickly added the RSS plugin. Oops, I forgot that requirement.
• Slinkity! "Add React, Vue or Svelte components to your existing site with zero extra setup." What?! I'm definitely exploring this in the near future.

So that brings us to now: 11ty SSG, using GitHub Actions, deploying to GitHub Pages, hosted for free. Nice! You can check out the code for this site on https://github.com/karlmayer/karlmayer-dev; it's also open-source.

And the $12? That's just for the Google .dev domain name. I like that Google put .dev on the HSTS preload list — it's time to deprecate HTTP and go 'HTTPS only'.