Next.js Boilerplate

Starter code for your Next.js blog Boilerplate with Tailwind CSS

From TODO comments to real refactors

June 6, 2020

Every codebase eventually collects TODO comments like dust.

  • // TODO: clean this up later
  • // FIXME: this is ugly but works
  • // HACK: don’t touch

This post is about that moment when you finally decide:
okay, today we pay the refactor tax.


Why refactoring feels scary

Refactoring isn’t just “making code pretty.”
You’re changing the shape of logic that already “works,” and your brain whispers:

“If I touch this, it might explode.”

The trick is to refactor in tiny, safe steps:

  1. Add a test (even a small one) around the behavior.
  2. Extract a small function with a clear name.
  3. Replace inline logic with the new function.
  4. Run tests. Commit.
  5. Repeat.

That way, you’re never more than one step away from something that still works.

Example error screen during a refactor:

Error

Treat this as a signal, not a failure.
You’re just shining light on paths that were already fragile.


A small refactor example

Imagine you keep doing this inline:

function myFunction(user) {
  return user && user.profile && user.profile.email
    ? user.profile.email.toLowerCase()
    : null
}