Guides / 2026-10-21

How to Generate TypeScript Types from API Responses

A practical workflow is: call the endpoint, copy the JSON body, paste it here, set the root name to the resource (User, Invoice, SearchResult), then download a .ts file.

Prefer a representative payload. Include both a full record and a sparse record in an array so optional fields show up.

{
  "items": [
    {
      "id": "usr_1",
      "name": "Ada",
      "profile": { "email": "[email protected]" }
    },
    {
      "id": "usr_2",
      "name": "Grace"
    }
  ],
  "total": 2
}

// Generated locally in your browser. No data was sent to a server.

export enum Id {
  Usr1 = "usr_1",
  Usr2 = "usr_2",
}

export interface Profile {
  email: string;
}

export interface Item {
  id: Id;
  name: string;
  profile?: Profile;
}

export interface UserList {
  items: Item[];
  total: number;
}

Edge cases

• Paginated envelopes ({ data, meta }) should use a root name like UserPage so the generated types stay readable.
• Do not paste secrets. Conversion is local, but the text is still in your clipboard and editor.
• Error payloads are different shapes. Convert success and error bodies separately instead of merging them into one type.

Open the converter with your own payload when you want to copy or download the generated .ts file.