How to convert JSON to TypeScript (automatic interfaces)

When you consume an API, the result of response.json() comes back as any: TypeScript doesn't know which fields exist, doesn't warn about typos, and doesn't autocomplete. Writing interfaces by hand for large responses is tedious and easy to get wrong. Generating the types from a real example solves the problem in seconds.

1. Open Transform and choose the JSON → TypeScript conversion.
2. Paste a representative JSON into the input field — for example, a response copied from your browser DevTools' Network tab.
3. In Root name, enter the name for the main type (here, User).
4. Click Transform, copy the result, and paste it into your types file.

With this JSON as input, the tool's real output is on the right:

{
  "id": 1,
  "name": "Ana Souza",
  "email": "ana@example.com",
  "active": true,
  "tags": ["admin", "beta"],
  "address": { "city": "São Paulo", "zip": "01310-100" },
  "orders": [
    { "id": 10, "total": 149.9 },
    { "id": 11, "total": 20, "coupon": "WELCOME" }
  ]
}

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

interface Order {
  id: number;
  total: number;
}

interface Order1 {
  id: number;
  total: number;
  coupon: string;
}

interface User {
  id: number;
  name: string;
  email: string;
  active: boolean;
  tags: string[];
  address: Address;
  orders: (Order | Order1)[];
}

• Each nested object becomes its own interface: address generated the Address interface, and the root uses the name you chose.
• Lists of plain values become string[], number[], and so on.
• In the orders list, the two items have different shapes (only the second one has coupon), so the tool generated a type for each shape and joined them with |.

const response = await fetch("/api/users/1");
const user: User = await response.json();

console.log(user.address.city); // your editor now autocompletes and checks the fields

Careful: annotating with : User tells the compiler what to expect, but doesn't check whether the response actually has that shape. If the API changes, the error only shows up at runtime. For data coming from outside your application, pair the types with a runtime validation.

• Null values: a null field in the example becomes the null type. If other responses carry a string in it instead, adjust it to string | null.
• Empty lists: with no items to inspect, the type comes out as unknown[]. Swap in the correct type, or use an example with at least one item.
• Numbers: integers and decimals both become number.
• Dates: JSON has no date type; they arrive as text and become string.

• Use a real, complete response, not a hand-edited snippet.
• Review the generated names and which fields can be null or optional.
• If your API publishes an OpenAPI spec, generating types from it is more reliable than inferring them from an example.