Typescript Patterns

When to Use

Apply when writing, reviewing, or refactoring any TypeScript code. Works for Node.js backends, React frontends, and full-stack projects.

Core Rules

• Always use strict: true in tsconfig — never disable it to fix an error
• Prefer type for unions and intersections, interface for object shapes that extend
• Use unknown over any at boundaries; narrow with type guards before use
• Never use as casts to silence errors — fix the type instead
• Avoid ! non-null assertions unless you've verified the value exists

Type Design

// Discriminated unions over boolean flags
type Result =
  | { success: true; data: T }
  | { success: false; error: string };

// Utility types — use them, don't reinvent
type UserPreview = Pick;
type PartialConfig = Partial;
type ReadonlyUser = Readonly;

// Branded types for semantic safety
type UserId = string & { readonly __brand: 'UserId' };
type EmailAddress = string & { readonly __brand: 'EmailAddress' };

// Const assertions for literal inference
const ROLES = ['admin', 'editor', 'viewer'] as const;
type Role = typeof ROLES[number]; // 'admin' | 'editor' | 'viewer'

Generics

// Constrain generics — never leave them open if you can help it
function first(arr: readonly T[]): T | undefined {
  return arr[0];
}

// Conditional types for inference
type Awaited = T extends Promise ? U : T;

// Template literal types for string APIs
type EventName = `on${Capitalize}`;

Runtime Safety

// Type guards at system boundaries
function isUser(value: unknown): value is User {
  return (
    typeof value === 'object' &&
    value !== null &&
    'id' in value &&
    typeof (value as User).id === 'string'
  );
}

// Zod for schema validation at API boundaries
import { z } from 'zod';
const UserSchema = z.object({ id: z.string(), email: z.string().email() });
type User = z.infer;

Error Handling

// Typed error classes
class ApiError extends Error {
  constructor(
    message: string,
    public readonly statusCode: number,
    public readonly code: string
  ) {
    super(message);
    this.name = 'ApiError';
  }
}

// Result pattern for expected failures
type Result = { ok: true; value: T } | { ok: false; error: E };

Tooling

• tsc --noEmit in CI — type-check without building
• tsx for running TypeScript directly in development
• tsup for library bundling (handles CJS/ESM dual output)
• ESLint with @typescript-eslint/recommended-type-checked — uses type info for deeper rules
• verbatimModuleSyntax: true in tsconfig — explicit import type for clarity

Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

• Author: chandrudp29
• Source: chandrudp29/skillhub
• License: MIT
• Homepage: https://pypi.org/project/skillhub-ai/

Install and usage instructions live in the source repository linked above.