I built a browser-only JSON to TypeScript Interface Generator — nested objects, arrays, options, 86 tests

#webdev #typescript #tools #javascript

When integrating a new API, the first thing I do is convert the JSON response to TypeScript interfaces. I built a free, browser-only JSON to TypeScript Interface Generator that handles nested objects, arrays, null, and union types.

Live Tool

👉 https://devnestio.pages.dev/json-to-typescript/

What it does

Auto-detect types — string, number, boolean, null, nested object interfaces, T[] arrays
Nested interfaces — generates sub-interfaces for nested objects automatically
Array handling — infers item type from first element, creates type alias for root arrays
Options — optional (?), readonly, export, semicolons on/off
Root name — configurable (default: Root)
Syntax highlighting — keywords in purple, interfaces in blue, types in green
Auto-convert — updates output 400ms after typing
Example presets — User, API Response, Config, Array, Deeply Nested
100% client-side — runs entirely in your browser

Example conversion

Input JSON:

{
  "id": 42,
  "name": "Alice",
  "active": true,
  "score": 98.6,
  "address": null,
  "tags": ["admin"],
  "profile": {
    "avatar": "url",
    "bio": "Developer"
  }
}

Generated TypeScript:

export interface Profile {
  avatar: string;
  bio: string;
}

export interface Root {
  id: number;
  name: string;
  active: boolean;
  score: number;
  address: null;
  tags: string[];
  profile: Profile;
}