metaΣ=3

ARTICLE  
Automated Vercel Redirect Maintenance on Eleventy

Automated Vercel Redirect Maintenance on Eleventy

Vercel, our static website hosting service, makes it easy to set up page redirects, you can have up to 1024 redirects. It's all controlled from a single JSON file. Many things can go wrong in that file, stakes are quite high (starting with SEO) and any redirect mistakes can be hard to spot.

Here's our automated checking setup.

Read article Automated Vercel Redirect Maintenance on Eleventy
ARTICLE  
Our Cache Busting Setup on Eleventy

Our Cache Busting Setup on Eleventy

Cache busting is necessary because browsers cache the static resources, namely, CSS and JS files, and if we update the website, visitors might not see their latest versions.

In theory, implementing web workers should solve the cache busting problem, and there are Eleventy plugins opens in a new tab for that, but, we decided not to enable the PWA setup until we test it properly.

Here's how we bust the cache in an old-school way, on Eleventy + Nunjucks + Parcel.

Read article Our Cache Busting Setup on Eleventy
ARTICLE  
Our Dark Mode Setup

Our Dark Mode Setup

Conceptually, dark/light mode on a website is driven by the buttons on the UI: whichever mode user picks, a data-theme attribute with that value gets set on <html> tag. We also persist that to browser's local storage.

Automatic mode setting "listens" to system's setting via @media (prefers-color-scheme: dark). Manual dark/light modes' CSS "listens" to <html> tag attribute's value by :root[data-theme='dark'].

That's pretty much it.

Here is the mixin we use.

Read article Our Dark Mode Setup