TypeScriptTips

Make bugs impossible.
One TypeScript tip at a time.

I like the tricks :) – Kasia

Use precise types

@RiccardoOdone•Suggest a tip•

Limit the possible values to the ones that make sense.

type CssProperty = string
const property: CssProperty = "margin-top"
const property: CssProperty =
  "biuutiful" // ⛔️ Not yet in the standard unfortunately

type CssProperty =
  "margin-top" | "margin-right" | "margin-bottom" | "margin-left" |
  "padding-top" | "padding-right" | "padding-bottom" | "padding-left"

// Or if you are as lazy as I am

type Prefix = "margin" | "padding"
type Suffix = "top" | "right" | "bottom" | "left"

type CssProperty =
  `${Prefix}-${Suffix}` // ✅ Same as the above `CssProperty`
  `${Prefix}${"" | `-${Suffix}`}` // ✅ Includes "margin" and "padding"
Type-safe carouselDo not throwFilter using a type assertionUse precise typesType-safe string templatingEnumerating a union typeNumbers with unitsZero nullEnumerating statusesAnd typesAvoiding window as anyUse descriptive valuesCheck authorization with typesExtract union types from record typesKeep in sync with conditional typesType-safe pickPass arguments by namePick instead of duplicatingPrevent mutationsType aliasesModel with different typesPrefer static types over testsPush conditionals downType-level functionsCheck Authorization With Types (again)From Union to TupleLimit typesLaser-focused typesCallable typesPartial considered harmfulSatisfy typesWTH?!Parse, don't castNarrow typesFetch footgunModel with different types (2)Polymorphic typesParse, don't cast (again)Type-safe envObject vs Recordconst Type ParametersDigType checksExpand intellisenseNumbers with units (2)Unchecked indexed accessExtract instead of duplicating

TypeScriptTips

Crafted with 💛 by Riccardo