JSON zu TypeScript

JSON einfügen, TypeScript-Interfaces und ein passendes Zod-Schema erhalten.

Läuft lokal · keine Uploads
JSON 
Was das Tool macht
Fügen Sie ein JSON-Beispiel ein, etwa eine API-Antwort Ihres ASP.NET-Core-Backends oder die Nutzlast eines Webhooks, und erhalten Sie TypeScript-Deklarationen, die Sie direkt in ein Frontend-Projekt übernehmen können. Die Ausgabe wird beim Tippen aktualisiert; ein zweiter Tab zeigt dasselbe Modell als Zod-Schema für die Validierung zur Laufzeit.
Wie die Typen abgeleitet werden
  • Jedes Array-Element wird ausgewertet, nicht nur das erste. Ein Schlüssel, der in manchen Elementen fehlt, wird optional (name?: string). Ein Schlüssel, der manchmal null ist, wird zu string | null.
  • Gemischte Arrays werden zu Unions, z. B. (string | number)[]. Ein leeres Array wird zu unknown[].
  • Identische Strukturen werden einmal deklariert. shippingAddress und billingAddress mit denselben Eigenschaften teilen sich ein Address-Interface.
  • Objekte mit IDs als Schlüssel ({"101": {...}, "102": {...}}) werden zu Record<string, T>.
  • Immer gültige Ausgabe: Eigenschaftsnamen, die keine Bezeichner sind ("first-name", "2fa"), werden in Anführungszeichen gesetzt. Typnamen sind PascalCase und bei Array-Elementen im Singular. Namen, die eingebaute Typen wie Date oder Error verdecken würden, erhalten ein Suffix.
  • ISO-Datumsstrings bleiben standardmäßig string, mit einem Kommentar, der sie als Datum oder Datum mit Uhrzeit kennzeichnet. Wenn Sie sie nach dem Parsen umwandeln, können Sie sie auch als Date typisieren. Das Zod-Schema prüft sie mit .datetime() oder .date() (ab Zod 3.23).
Optionen
Wählen Sie interface oder type, schalten Sie export und readonly ein oder aus, wählen Sie T[] oder Array<T> und legen Sie den Namen des Wurzeltyps fest. Ein Array als Wurzel ergibt einen Elementtyp und einen ...List-Alias.
So verwenden Sie es
Fügen Sie JSON ein oder ziehen Sie eine .json-Datei hinein und kopieren oder laden Sie dann die TypeScript- oder Zod-Ausgabe herunter.
Datenschutz
Die Umwandlung läuft vollständig in Ihrem Browser. Ihr JSON wird nie hochgeladen; die letzte Eingabe wird im lokalen Speicher behalten.