Mastering TypeScript 6.0: Advanced Patterns for Large Scale Apps

TypeScript is easy to learn but hard to master. In large codebases, "any" is the enemy. We need precise, expressive types that catch bugs before they happen.

1. Template Literal Types

You can manipulate strings at the type level.

type World = "world";
type Greeting = `Hello ${World}`; // "Hello world"

type Color = "red" | "blue";
type Quantity = "light" | "dark";
type Palette = `${Quantity}-${Color}`; 
// "light-red" | "light-blue" | "dark-red" | "dark-blue"

2. Conditional Types & The infer Keyword

Conditional types are like ternary operators for types.

type IsString<T> = T extends string ? true : false;

type A = IsString<"hello">; // true
type B = IsString<42>;      // false

The infer keyword allows you to extract types from within other types.

type ReturnType<T> = T extends (...args: any[]) => infer R ? R : any;

function getUser() { return { name: "Alice", id: 1 }; }
type User = ReturnType<typeof getUser>; // { name: string; id: number }

3. Branded Types (Nominal Typing)

TypeScript is structurally typed. Sometimes you want nominal typing (e.g., to distinguish between USD and EUR).

type Brand<K, T> = K & { __brand: T };

type USD = Brand<number, "USD">;
type EUR = Brand<number, "EUR">;

const dollars = 10 as USD;
const euros = 10 as EUR;

// dollars = euros; // Error! Type 'EUR' is not assignable to type 'USD'.

4. Utility Types for API Responses

Don't manually type every response. Derive them.

interface User {
  id: number;
  name: string;
  email: string;
  role: "admin" | "user";
}

// CreateUserDTO shouldn't have ID (generated by DB)
type CreateUserDTO = Omit<User, "id">;

// UpdateUserDTO should have everything optional
type UpdateUserDTO = Partial<User>;

// PublicProfile should hide email
type PublicProfile = Pick<User, "id" | "name">;

Conclusion

Advanced TypeScript isn't just about showing off. It's about encoding your business logic into the type system, making invalid states unrepresentable.