Site Design: Technology and Infrastructure

Published on January 23, 2023

So, what is this site built with?

When approaching a new project, there's always the temptation to use whatever I last heard about on Fireship. Especially as a web developer in 2023, some might say the toughest part of any project is picking the frameworks, platforms, and libraries you'll use to build it. There is an abundance of new technologies out there, an infinite number of hammers for a finite number of projects.

TLDR; I'm a traditionalist. There seems to be a law of diminishing returns when it comes to adopting web frameworks. If I'm losing more time than I gain after the quickstarts (quitstarts), build steps, and dependency management, I'll just stick with what I know: good ole HTML, CSS, and Javascript (supported by all major browsers!).

Framework

This site is built with Eleventy, a minimalistic static site generator. Content is written in Markdown, templates are built with Liquid. Here are a few basic principals that led me to Eleventy:

• Templating - Without the ability to create templated content, you won't get very far in scaling any project. Eleventy is unique because you can use almost any templating language, and even use multiple if needed.
• Flexibility - An Eleventy project requires no config by default and uses just a single build step when you're ready to deploy.
• Static Site Generation - I tend to prefer browser-based navigation and as little Javascript funny-business as possible. Also, if you generate your site to static HTML, hosting becomes a lot less complicated.
• File-Based Routing - What a novel concept! I've chuckled as new frameworks boast this as a feature, as if file-based routing hasn't been offered since the Apache days.

Packages

There are a few other packages I'm using. CSS is generated with Sass to leverage nested CSS and minimization. I've also included Prism for syntax highlighting, if my blog posts ever get that technical.

Don't even ask me about Tailwind, unlike most developers I actually enjoy writing CSS 🤪

Other Considerations

I've recently discovered Remix, a promising full-stack framework that can generate a static frontend and also handle backend APIs / logic. I've also been interested in Nuxt for quite a while, I tend to prefer the syntax of Vue to React. But at the end of the day, both offered more horsepower than what was needed for this website.

Deployment and Hosting

As a developer I have certainly hopped on the "static" train, especially when static hosting is typically free or almost free. Cloudflare Pages is the host I've chosen for this project. It's free, has a direct integration with GitHub, and has built-in CDN benefits. Along with that, they've recently made their edge functions available with the free tier, so there's the possibility for server-side logic if I need it.