How to Convert JSON to TypeScript Interfaces (API Responses, Optional Fields & Nested Objects)

If you consume REST APIs in TypeScript, you need interfaces that match the response shape — for autocomplete, compile-time safety, and documentation. Writing them by hand from a big payload is slow and easy to get wrong. Here's how to generate them correctly in seconds.

Why type your API responses at all?

• Autocomplete on every property, so you stop guessing field names.
• Compile-time errors when you misspell a key or assume the wrong type.
• Living documentation — the interface is the contract for the data.

From JSON to interface in 3 steps

1. Paste your JSON (or an API response) into the converter.
2. Set the root interface name and choose interface or type output, with or without export.
3. Copy the generated interfaces or download a .ts file.

A real example

Given this API response:

{
  "id": 1,
  "name": "Jane Doe",
  "address": { "city": "Somewhere", "zip": "12345" },
  "tags": ["admin", "editor"]
}

you get clean, nested interfaces:

export interface Root {
  id: number;
  name: string;
  address: Address;
  tags: string[];
}

export interface Address {
  city: string;
  zip: string;
}

Optional fields (the part most tools get wrong)

Real APIs return inconsistent records — a field is present on some items and absent on others. A good converter looks across all items in an array and marks the inconsistent ones optional. Given:

[
  { "id": 1, "name": "Ada", "email": "ada@x.com" },
  { "id": 2, "name": "Linus" }
]

the correct output marks email optional:

export interface RootItem {
  id: number;
  name: string;
  email?: string;
}

export type Root = RootItem[];

Without this, you either lose the email field entirely (if the tool only samples the first item) or get a type that lies about the data. Optional detection across array items is what makes the output trustworthy.

Arrays and union types

Arrays of primitives become string[], number[], etc. Mixed arrays become a properly-parenthesised union — (string | number)[], not the ambiguous string | number[] (which means "a string or a number-array"). Nested arrays type correctly too: [[1,2],[3]] becomes number[][].

interface vs. type alias

Both work. interface is conventional for object shapes and supports declaration merging; type aliases are handy for unions and intersections. The converter lets you switch output style with one click — pick whatever your codebase standardises on.

Tips for clean generated types

• Paste a representative array, not a single record — that's how optional fields are detected.
• Name the root after the entity (User, Order) instead of the default.
• Review nullable fields — a JSON null becomes null in the type; you may want string | null if the API sometimes returns a value.
• Validate first if the JSON won't parse — use the JSON Validator.

Frequently asked questions

Does it handle deeply nested objects? Yes — every nested object becomes its own named interface, referenced by the parent.

Is my data uploaded anywhere? No — conversion runs entirely in your browser.

Can I get Python or Java types instead? Yes — see JSON to Python and JSON to Java.

Wrapping up

Generating TypeScript interfaces from JSON turns minutes of boilerplate into a paste-and-copy. The details that matter — nested interfaces, optional fields across records, and correct unions — are exactly what a good generator handles for you.

Related free tools: JSON to Python · JSON Schema Generator · JSON Validator · All JSON Tools