JSON to TypeScript Converter — Free, In-Browser
Generate TypeScript interfaces from JSON. Handles nested objects, unions, and shows limitations like empty arrays and missing fields.
JSON to TypeScript Interface Converter
Files never leave your browser0 lines · 0 chars · 0 B
0 lines · 0 chars · 0 B
You're on 7BusyBoss — 300+ free tools that run instantly in your browser. No signup, nothing uploaded.
Empty arrays hide their element type
An array in your sample may simply be empty: "tags": []. There is nothing there to infer from, so the generator emits unknown[] — an array of anything.
This is honest but not useful, and worse, it is quiet: when real data arrives full of objects, nothing in your editor warns you that you are reaching for a field the type never described. Fill the element type in by hand from the API documentation — change unknown[] to Tag[] and define Tag yourself — or, better, find a sample response where the array actually has items in it and regenerate.
A null value tells you less than it appears to
When a field is null in the sample, the generator types it as null and marks it optional with ?. That reflects the sample accurately, but it conflates two different facts that the sample cannot separate: whether the field is always present but sometimes null, or whether it is sometimes absent altogether.
The generated maybeAuthor?: null claims the field may be missing and, when present, is only ever null — which is almost never what the API actually means. If it is always sent and merely nullable, drop the ? and widen the type to Author | null. This one-line correction is the most common fix you will make to a generated interface.
Optional fields are invisible when the sample is complete
The mirror image of the problem above, and the reason a generated type gives false confidence. If your sample response happens to include every field, everything is generated as required. A field the API omits when empty is typed as always present, and the compiler will then happily let you read it with no check at all — producing exactly the runtime undefined error that having types was supposed to prevent.
Generate from the largest, most representative response you can obtain, then go through the result marking genuinely optional fields with ?. The generator saves you the transcription; it cannot do the judgement.
Nested objects, unions and key naming
An object inside an object becomes its own interface, named by converting the property name to PascalCase — author_info produces export interface AuthorInfo — so identical shapes appearing in several places collapse to one definition.
Arrays whose elements differ generate a union, such as (string | number)[]. That describes the sample faithfully, but one sample cannot show every variant the API might send, so widen it by hand where you know more than the sample does.
Property names that are valid JavaScript identifiers appear as-is. Anything else — a name with a hyphen, or one starting with a digit — is emitted as a quoted key, so my-prop becomes "my-prop": string; inside the interface. If the root of your JSON is an array or a primitive rather than an object, you get a type alias instead of an interface: export type Root = string[];
Types vanish at runtime
These are structural types checked at compile time and erased entirely when the code runs. A generated interface does not validate anything — it is an assertion about data you have not inspected, and if the API changes shape your program will fail exactly as it would have without types, just later and more confusingly.
Where the data genuinely cannot be trusted, a runtime validation library such as Zod or Valibot is the answer, checking the response as it arrives. A generated interface and a runtime validator solve different problems, and neither substitutes for the other.
See also: cURL to Fetch, JSON to Go Struct, and Query String to JSON.
How to use the JSON to TypeScript Interface Converter
Takes about a minute. No signup, no download, your data stays in your browser.
- 1Open the tool. Scroll up to the JSON to TypeScript Interface Converter above — it loads instantly in your browser, no install needed.
- 2Enter your values. The fields come pre-filled with realistic defaults so you can see how it works — replace them with your own numbers.
- 3Read the result. The output updates instantly. Copy or share it — nothing is uploaded to a server, everything stays on your device.
Frequently asked questions
Common questions about the JSON to TypeScript Interface Converter.
Why does my empty array become unknown[]?
Because the element type is inferred from the elements, and an empty array has none. Find a sample response where the array actually contains an item and regenerate — that is far more reliable than writing the type by hand. If no such sample exists, define the element interface yourself from the API documentation and replace unknown[] with it.
What if a field is sometimes present and sometimes missing?
The generator cannot know. If your sample includes the field, it is marked required, and the compiler will then let you read it without any check — which is how a fully typed codebase still produces undefined errors at runtime. Generate from the most complete response you can get, then add the ? marker to the fields you know are optional.
A field came out as maybeAuthor?: null. Is that right?
Almost certainly not what you want. The sample had null there, so the generator recorded both that it might be absent and that its only value is null. If the API always sends the field but it can be empty, remove the question mark and widen the type to Author or null. This is the most common correction to a generated interface.
How are property names with hyphens or leading digits handled?
They are emitted as quoted keys, so my-prop appears as "my-prop": string; within the interface. Names that are valid JavaScript identifiers are left alone. Interface names for nested objects are converted to PascalCase, so author_info becomes AuthorInfo.
Do these types validate my API response at runtime?
No. TypeScript types are checked at compile time and erased completely when the code runs, so a generated interface is an assertion about data nobody has inspected. If the API changes shape your program still breaks, just later and less obviously. For untrusted data, validate the response as it arrives with a runtime library such as Zod or Valibot.
Community rating
Discussion (0)
No comments yet. Start the discussion.
Keep exploring
Related tools across 7BusyBoss — all free, all instant.
More in Code Converters
- HTML to JSX Converter
- Query String to JSON Converter
- cURL to Fetch Converter
- JSON to Go Struct Converter
- SQL INSERT to JSON Converter