JSON vers TypeScript
Des types à partir d'un JSON
JSON
Types générés
Collez un JSON pour générer ses types.
À propos de l'outil
Cet outil transforme un exemple de JSON en types TypeScript prêts à coller. Il sert surtout à typer la réponse d’une API que vous consommez, un fichier de configuration ou des données de test, sans écrire chaque interface à la main ni risquer d’oublier un champ imbriqué au troisième niveau.
Les objets imbriqués reçoivent chacun leur propre type, nommé d’après leur clé, et les structures identiques partagent le même nom. Dans un tableau d’objets, une clé absente de certains éléments devient facultative et les valeurs null s’ajoutent au type. Vous choisissez interface ou type, le nom du type racine, l’ajout d’export et de readonly, et un onglet propose l’équivalent en schéma Zod.
Comment l'utiliser
- Collez votre JSON dans le champ « JSON » ou cliquez sur « Exemple » pour essayer.
- Renseignez « Nom du type racine » et choisissez interface ou type dans « Déclaration ».
- Cochez « Ajouter export » ou « Propriétés en lecture seule (readonly) » selon vos conventions.
- Dans « Types générés », passez de l’onglet « TypeScript » à « Schéma Zod » si besoin.
- Cliquez sur « Copier » ou « Télécharger » pour récupérer le fichier types.ts ou schema.ts.
Questions fréquentes
Comment l’outil détecte-t-il les propriétés facultatives ?
Il fusionne tous les objets d’un même tableau. Une clé présente dans certains éléments seulement est marquée facultative avec ?, ou .optional() dans Zod. Une clé qui vaut parfois null reçoit le type | null. Plus votre exemple est représentatif, plus les types sont justes.
Mon JSON est-il envoyé sur un serveur ?
Non. L’analyse et la génération des types se font dans votre navigateur. Le JSON collé n’est ni envoyé ni enregistré ; seuls vos réglages, comme le nom du type racine ou le choix interface ou type, sont mémorisés localement dans ce navigateur.
Que faire si mon JSON est invalide ?
L’outil affiche « JSON invalide » avec la ligne et la colonne de l’erreur, et montre la ligne fautive avec un repère sous le caractère en cause. Corrigez-la dans le champ : les types se mettent à jour automatiquement à chaque modification.
Comment utiliser le schéma Zod généré ?
Installez le paquet zod dans votre projet, puis collez le code : chaque objet a son schéma, défini avant d’être utilisé, et le type racine est déduit avec z.infer. Vous pouvez ainsi valider une réponse d’API à l’exécution avec schema.parse().