Use TypeScript Utility Types with JSON-Generated Interfaces

Deriving Types with Utility Types

Once you have a base interface generated from JSON, you rarely use it as-is everywhere. TypeScript's built-in utility types let you derive specialized variants without repeating fields.

Base Interface (from JSON)

interface User {
  id: number;
  name: string;
  email: string;
  avatarUrl: string;
  role: "admin" | "editor" | "viewer";
  createdAt: string;
}

Pick — Select Specific Fields

type UserSummary = Pick<User, "id" | "name" | "avatarUrl">;
// { id: number; name: string; avatarUrl: string }

Use Pick for API responses that return a subset of fields, or for component props that only need a few properties.

Omit — Exclude Fields

type CreateUserInput = Omit<User, "id" | "createdAt">;
// { name: string; email: string; avatarUrl: string; role: ... }

Use Omit for creation payloads where server-generated fields like id and createdAt are absent.

Partial — All Fields Optional

type UpdateUserInput = Partial<Omit<User, "id" | "createdAt">>;
// { name?: string; email?: string; avatarUrl?: string; role?: ... }

Use Partial for PATCH endpoints where any subset of fields can be updated.

Required — All Fields Mandatory

type StrictUser = Required<User>;

Use Required when you have validated that all optional fields are present (e.g., after a form submission check).

Combining Utility Types

You can chain them for precise control:

type EditableFields = Partial<Pick<User, "name" | "email" | "avatarUrl">>;

Custom Utility Types

For patterns you use frequently, define your own:

type Optional<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;

type UserWithOptionalAvatar = Optional<User, "avatarUrl">;

This approach keeps a single source of truth (the base interface from JSON) while deriving all variants from it. When the API changes, you only update one interface.