Yuzool

Dev Tools

JSON to TypeScript

Paste an example of the JSON an API returns and get TypeScript interfaces for it: nested objects become their own interfaces, lists get their item type, and fields missing from some items become optional.

An example

JSONTypeScript
{"id":1,"tags":["a"],"owner":{"name":"Ann"}}export interface Root {
id: number;
tags: string[];
owner: Owner;
}

export interface Owner {
name: string;
}

Check what it guessed

One example can’t show every case. A field that is null in your example comes out as null; a list that’s empty comes out as unknown[]. Widen those by hand (string | null) once you know the real shape.

How to use it

  1. Paste a JSON example, ideally a list with several items.
  2. Pick interface or type, and name the root.
  3. Copy the TypeScript into your project.

Questions

interface or type?

For object shapes either works. Interfaces can be extended and merged; types can also describe unions. Pick whichever your codebase uses.

Is my JSON uploaded?

No. The types are worked out in your browser.

Related tools

Open all 35 Dev Tools. Everything runs in your browser; nothing you paste is uploaded.

Settings

History

Snippet