typescript-expert

📘 TypeScript Expert — Production-Grade TypeScript

Philosophy: TypeScript's type system is your first line of defense. If it compiles, it should be mostly correct. If you're using any, you're using JavaScript with extra steps.

1. When to Use This Skill

• Writing new TypeScript/JavaScript modules
• Reviewing TS/JS code for patterns and type safety
• Building React components or Node.js services
• Configuring TypeScript projects (tsconfig, bundlers)
• Migrating JavaScript to TypeScript
• Debugging type errors

2. Type System Mastery

Use Discriminated Unions Over Enums

// GOOD: Discriminated union — exhaustive checking
type Result<T> =
  | { status: "success"; data: T }
  | { status: "error"; error: string }
  | { status: "loading" };

function handleResult(result: Result<User>) {
  switch (result.status) {
    case "success":
      console.log(result.data.name); // TS knows data exists
      break;
    case "error":
      console.error(result.error); // TS knows error exists
      break;
    case "loading":
      showSpinner();
      break;
    // If you miss a case, TS will warn you
  }
}

// BAD: Enum + separate error field — runtime bugs
enum Status { Success, Error, Loading }
interface Result { status: Status; data?: User; error?: string; }

Utility Types

// Don't reinvent — use built-in utility types
type UserCreate = Omit<User, "id" | "createdAt">;
type UserUpdate = Partial<Pick<User, "name" | "email">>;
type ReadonlyUser = Readonly<User>;
type UserRecord = Record<string, User>;

// Branded types for type-safe IDs
type UserId = string & { __brand: "UserId" };
type TeamId = string & { __brand: "TeamId" };

function getUser(id: UserId): User { ... }
// getUser("abc" as TeamId) → Type error!

Zod for Runtime Validation

import { z } from "zod";

const UserSchema = z.object({
  name: z.string().min(2).max(100),
  email: z.string().email(),
  role: z.enum(["member", "admin", "viewer"]).default("member"),
});

type User = z.infer<typeof UserSchema>; // Type derived from schema

// Validate at API boundary
const result = UserSchema.safeParse(requestBody);
if (!result.success) {
  return res.status(400).json({ errors: result.error.issues });
}
const user: User = result.data; // Fully typed and validated