TypeScript Patterns I Wish I Knew Sooner
ReactTypeScriptclean code

TypeScript Patterns I Wish I Knew Sooner

Jed Llenado20 Feb 2025

After shipping TypeScript for 4 years, these are the patterns that changed how I write React components.

Discriminated Unions for State

Instead of multiple booleans (isLoading, isError, isSuccess), use a discriminated union: type State = {status: 'loading'} | {status: 'error', message: string} | {status: 'success', data: Data}. TypeScript narrows perfectly.

Const Assertions for Config

as const turns your arrays and objects into readonly literal types, which lets you derive union types from them automatically.

All Postsjedllenado.online