Tutorials · CSS at Scale

Untangling a Messy Codebase

This series starts where most CSS tutorials end: with a codebase that works, mostly, but not in a way anyone fully understands.

Over eleven chapters, you will work through a real client scenario — a small venue website built by three different developers over five years. The CSS has grown without a plan. There is a file called fixes.css. There are !important declarations that nobody wants to touch. The client says the site feels inconsistent. You have been asked to clean it up.

Each chapter picks up one observation from the first read-through of the codebase and explains the mechanism behind it, not in the abstract, but by tracing exactly what is happening in this project. Theory arrives when you need it. You will not spend a chapter on the box model before seeing a button.

By the end, the same codebase will exist in a form you would be comfortable handing off or returning to in a year. More usefully, you will be able to do the same thing the next time someone gives you a codebase you did not write.

Download the Millworks starter project before Chapter 01. Instructions are at the top of that chapter.

  1. INTRO Introduction
  2. CH.01 The Brief and the Codebase