Blog

Posts on software development, careers, and craft.

React PropTypes are dead to me

React PropTypes are dead to me. PropTypes: ❌ Checks at run-time ❌ React-specific ❌ No refactor protection ❌ Flakey autocomplete (plugins/patterns r...

An interesting JavaScript template string trick: You can replace this: {...

An interesting JavaScript template string trick: You can replace this: { "aria-required": isRequired ? "true" : "false"; } with this: { "aria-requi...

Scenario: You're using TypeScript, and want statically typed CSS too

Scenario: You're using TypeScript, and want statically typed CSS too. The answer: vanilla-extract. 😍 It's like CSS modules, but also type safe! (a...

HTML accessibility tip: Only add a role if you can't use the ideal HTML tag

HTML accessibility tip: Only add a role if you can't use the ideal HTML tag. Why? Because many HTML tags automatically apply the proper role. Examp...

30+ HTML tags to consider before using a div: header footer nav main section...

30+ HTML tags to consider before using a div: header footer nav main section summary caption label p ul ol blockquote article aside mark details fi...

Job satisfaction is driven by 5 factors: 1

Job satisfaction is driven by 5 factors: 1. Significance: The work is meaningful and impactful 2. Task identity: A feeling of ownership in the work...

z-index Tip: When creating a reusable component that declares a z-index, add...

z-index Tip: When creating a reusable component that declares a z-index, add this style to the root element: isolation: isolate Why? This creates a...

I've started using @Cypress_io & @TestingLib for more than testing

I've started using @Cypress_io & @TestingLib for more than testing. They're now part of my daily *dev* workflow. I do TDD by automating the bro...

The difference between `any` and `unknown` in #TypeScript: any = “I don’t...

The difference between `any` and `unknown` in #TypeScript: any = “I don’t care” unknown = “I don’t know” Prefer `unknown` over `any`. Why? Because...

I'm excited about the new type narrowing features in #typescript 4.4

I'm excited about the new type narrowing features in #typescript 4.4. Now we can check types on one line, and TypeScript will "remember" that we na...

After shipping multiple projects with #TypeScript, I wouldn't go back to JS

After shipping multiple projects with #TypeScript, I wouldn't go back to JS. Yes, TypeScript requires extra work up front to declare types. But, th...

The only technique I’ve found for creating reliable end-to-end tests: 1

The only technique I’ve found for creating reliable end-to-end tests: 1. Run the app against a test db instance. 2. Recreate the db with a static d...

My favorite way to create a new JavaScript object with a property omitted is...

My favorite way to create a new JavaScript object with a property omitted is Rest/spread. // Create a user without the address property const { add...

Common problem: "We don't have time to improve our process"

Common problem: "We don't have time to improve our process". "We don't have time to mock the APIs" = waste time with flakey calls. "We don’t have t...

Simple #TypeScript tip I wish someone had told me long ago: If you get a...

Simple #TypeScript tip I wish someone had told me long ago: If you get a giant, scary error message, scroll to the end. The end of the message is t...

Just learned about SWC, a Babel alternative

Just learned about SWC, a Babel alternative. Next.js is transitioning to use it instead of Babel. Why? It's 20x faster than Babel. How? It's writte...

When unit testing, I rarely use mocking libraries

When unit testing, I rarely use mocking libraries. Instead, I restructure the code so mocking isn't necessary. Here's how: 1. I split the code into...

How I pivoted from an object-oriented programming style to a functional...

How I pivoted from an object-oriented programming style to a functional programming style: 1. I stopped attaching behavior to objects. My objects a...

Habit: When I'm done coding, I don't immediately open a pull request

Habit: When I'm done coding, I don't immediately open a pull request. I prefer to sleep on it. After a good night's sleep, I typically find multipl...

TypeScript tip: Declaring type keys in alphabetical order makes them easier...

TypeScript tip: Declaring type keys in alphabetical order makes them easier to read later. The good news is, you don’t have to manually alphabetize...

A well-structured codebase is consistent on the following: Validation HTTP...

A well-structured codebase is consistent on the following: Validation HTTP calls Sharing code Error handling Automated tests Route declarations Fil...

My rule for React state: Any state that can be derived, should be derived

My rule for React state: Any state that can be derived, should be derived. This seems obvious with a simple example like this. But it's a surprisin...

As I’ve learned TypeScript over the years, I’ve noticed a pattern: If it’s...

As I’ve learned TypeScript over the years, I’ve noticed a pattern: If it’s hard to type via TypeScript, I should probably rethink my design. #types...

The best financial advice I've found: 1

The best financial advice I've found: 1. Avoid being showy. Live beneath your means. Slack = freedom. 2. Avoid liabilities. Grow income via index f...

It’s remarkable how much better life is on a development team with this...

It’s remarkable how much better life is on a development team with this simple rule: Code is automatically deployed to production when merged. No m...

A practical alternative to pair programming that I enjoy: I open PRs early,...

A practical alternative to pair programming that I enjoy: I open PRs early, and request feedback early. I say "This isn't done, but how do you feel...

Just used TypeScript to enforce distinct prop combinations

Just used TypeScript to enforce distinct prop combinations. (also known as conditional props) 😍 In this example, I created a Card component that r...

Today I learned about CSS' currentColor value

Today I learned about CSS' currentColor value. It says "apply this element's color to this other attribute". So in this example, the border will be...

As a dev, I do "Quality Assurance"

As a dev, I do "Quality Assurance". 1. I run and test my own code. 2. I run and test my fellow developer's code during code reviews. Dedicated QA c...

I run each PR I review locally

I run each PR I review locally. Why? Because there are many things that are hard to evaluate by merely reading code: Responsive design Accessibilit...