Home / Developer Tools / JSON to TypeScript / Class Generator

What This Tool Does

This tool takes a JSON object or array and automatically generates strongly-typed data models for various programming languages. It recursively infers types, nested structures, and array types.

Inputs Explained

How It Works

The generator parses the JSON into an AST-like representation of its types. It infers numeric types as integers or floats, array types by looking at elements (using unions if mixed), and extracts nested objects into separate classes. Finally, it outputs idiomatic code for the chosen language.

Formula / Logic Used

function infer(val): if typeof val=='number' return NumberType; if Array, return ArrayOf(infer(val[0])); if Object, extract new interface.

JSON to TypeScript / Class Generator

Paste JSON, get strongly-typed interfaces and classes.

Step-by-Step Example

Input JSON:

{"user": {"id": 1}, "active": true}

TypeScript Output:

export interface Root {
  user: User;
  active: boolean;
}
export interface User {
  id: number;
}

Use Cases

Assumptions and Limitations

âš  Browser-only, no upload, no storage. Your data never leaves your device.

Frequently Asked Questions

How do I generate optional vs required fields in a TypeScript interface?

A field is optional in TypeScript when it has a ? after the name: name?: string. Our generator decides this by inspecting your sample JSON — if you provide multiple sample objects and a field appears in some but not others, we mark it optional. With a single sample, we treat all fields as required by default, but you can toggle "Make all optional" or click any field to override. Important nuance: name?: string allows the field to be missing or undefined, but name: string | null allows it to be present and null. They're different things.

How do I generate a TypeScript enum from a JSON list?

If your JSON has an array of unique strings — for example, ["draft", "published", "archived"] — our generator can output a TypeScript enum like: enum Status { Draft = "draft", Published = "published", Archived = "archived" } Toggle "Generate enums for unique-value arrays" in the settings. We also support string union types as an alternative: type Status = "draft" | "published" | "archived" — often preferred in modern TypeScript because they're zero-runtime-cost. For longer lists, use as const arrays plus typeof extraction for the cleanest setup.

How do I handle nullable fields when generating TypeScript from JSON?

When a field's value is null in the JSON, our generator outputs the type as T | null. So { "age": null } becomes age: number | null if we can't infer the original type, or age: null as a strict literal. If both null and a real value appear across samples, we widen to a union: age: number | null. For optional-and-nullable (the field can be missing OR null), use age?: number | null. TypeScript distinguishes between "missing" and "explicitly null" — your API contract should make clear which one is expected.

How do I name TypeScript interfaces generated from JSON?

Default rule: PascalCase with sensible roots. Top-level becomes Root (or whatever name you set in the input). Nested objects use the parent key name singularised — so users[] becomes User. Our generator lets you rename any interface inline before export. Tips: avoid names that clash with TypeScript built-ins (String, Object); prefix with your domain when integrating multiple APIs (PaymentInvoice, BillingInvoice); and keep collection types separate from item types (UserList vs User). For deeply nested JSON, the auto-naming can produce repeats like Address1, Address2 — rename them to something meaningful before saving.

Sources and References

Related Calculators

JSON Diff JSON to XML Markdown to HTML Regex Tester HTML Entities YAML to JSON

JSON to TypeScript / Class Generator practical guide

The generator infers TypeScript shapes from real JSON samples, including primitive fields, arrays, nested objects, nullable values, and optional-looking keys. This section gives visitors enough context to understand the calculation, choose the right inputs, and decide whether the result is suitable for a rough estimate, a worksheet answer, or a planning discussion.

How to use this developer tool

  1. Start with the value you know best and confirm the unit shown beside the input field.
  2. Fill only the fields requested by the tool. If a field is optional, use it when it changes the real-world result, such as time, rate, power factor, credits, or serving count.
  3. Press calculate, then read the main result together with any secondary values, conversions, warnings, or examples on the page.
  4. Run one simple test case before using the result in a report. A quick mental check catches unit mistakes and misplaced decimals.

Formula or method used

Paste representative JSON, choose interface or type output, review optional fields, rename root types, then copy the generated code into your project and adjust edge cases. The important habit is to keep every input on the same basis before comparing results. For example, do not mix hours with minutes, grams with kilograms, square feet with square meters, or apparent power with real power unless the calculator explicitly converts those units.

Worked example

A sample with user.id, user.name, and user.tags should produce a user object type with a numeric or string id, a string name, and a string array for tags. This kind of small example is useful because it makes the direction of the calculation clear. After the result looks sensible, replace the sample numbers with your real project, class, recipe, prompt, or equipment data.

When this page is useful

Use JSON to TypeScript / Class Generator for API clients, mock data typing, frontend contracts, schema exploration, and safer TypeScript migrations. It is also helpful when you need a fast second opinion before copying numbers into a spreadsheet, invoice, lab note, design brief, homework solution, or project estimate.

Accuracy tips

  • Prefer measured values over rounded or advertised values whenever accuracy matters.
  • Write down the unit beside each number so the same calculation can be checked later.
  • Round final answers to a sensible number of digits; too many decimals can look more accurate than the inputs really are.
  • Use professional guidance for legal, tax, medical, electrical installation, or safety-critical decisions.

Common mistakes to avoid

The most common errors are entering the right number in the wrong unit, forgetting a multiplier such as 1,000, using a default rate that does not match your location, or treating an estimate as a certified result. If the answer seems surprisingly high or low, halve or double one input and see whether the output changes in the expected direction. That simple sensitivity check helps visitors trust the tool and understand the relationship between inputs and results.

Mini FAQ

Can I use this result directly?

For learning, planning, and quick comparisons, yes. For compliance, contracts, tax filing, health decisions, or electrical work, treat the result as a starting point and verify it against official guidance or a qualified professional.

Why do two calculators sometimes give slightly different answers?

Differences usually come from rounding, default assumptions, unit conversions, or whether the tool includes optional factors. Check the formula, input units, and rounding method before deciding which result is more appropriate.