Générateur d’interfaces TypeScript à partir de JSON

À quoi sert un convertisseur JSON vers TypeScript ?

Il déduit des types statiques à partir de données d’exemple. Au lieu d’écrire à la main une interface pour chaque réponse d’API, vous collez une réponse réelle et obtenez les déclarations TypeScript correspondantes : une interface nommée par objet imbriqué, des tableaux typés et des unions lorsque les valeurs diffèrent. C’est le moyen le plus rapide d’obtenir l’autocomplétion et les vérifications à la compilation pour les données reçues d’une API REST, d’un webhook ou d’un fichier de configuration JSON.

Comment les types sont déduits

Les tableaux d’objets sont fusionnés

Lorsqu’un tableau contient plusieurs objets, le générateur les fusionne en une seule interface au lieu de ne prendre que le premier élément. Une clé présente dans certains éléments mais pas dans d’autres devient optionnelle (archived?: boolean), et une clé dont les valeurs diffèrent d’un élément à l’autre reçoit un type union (license: string | null). Les interfaces des éléments de tableau sont nommées d’après le singulier de la clé : repos → Repo, categories → Category. Les structures identiques trouvées à différents endroits sont déclarées une seule fois et réutilisées.

interface ou type ?

Pour les structures d’objets, les deux sont presque interchangeables. Les déclarations interface peuvent être étendues avec extends et fusionnées en les redéclarant, et elles produisent généralement des messages d’erreur plus clairs ; les alias type permettent d’exprimer des unions, des tuples et des types mappés. Beaucoup d’équipes utilisent les interfaces pour les modèles de données : choisissez celui qui correspond à vos règles de lint (par exemple @typescript-eslint/consistent-type-definitions).

Limites de la déduction : relisez le résultat

Un exemple montre uniquement ce qui était présent. Un champ valant null dans votre exemple sera typé null ; modifiez-le avec le type réel (par exemple string | null). Les dates arrivent sous forme de chaînes ISO et sont typées string, car JSON ne possède pas de type date. Les clés qui ne sont pas des identifiants valides, comme social-links, sont automatiquement entre guillemets. Pour valider à l’exécution des données non fiables, associez ces types à un validateur de schéma comme Zod. Commencez par nettoyer votre exemple avec le Formateur JSON, ou convertissez d’abord vos configurations YAML avec YAML vers JSON avant de générer les types.

Aussi recherché comme : json to typescript, générer interface typescript depuis json, convertisseur json typescript, json to interface, générer types typescript json, json2ts.

Outils complémentaires : JSON vers TypeScript

• CSV vers JSON — Collez du CSV ou du TSV pour obtenir un tableau JSON d'objets.
• SVG vers JSX — Collez un SVG issu de Figma, Illustrator ou d’une bibliothèque d’icônes et obtenez un composant React (JSX ou TSX) prêt à l’emploi, avec un aperçu sécurisé de l’icône.
• cURL vers code — Collez une commande curl, issue de la documentation d’une API ou de l’option « Copier en tant que cURL » des outils de développement de votre navigateur, et obtenez du code prêt à l’emploi pour six langages, avec les en-têtes, le corps de requête et l’authentification repris à l’identique.
• Validateur JSON Schema — Collez un schéma et du JSON pour voir précisément quelles valeurs enfreignent quelle règle, ou générez un schéma de départ à partir de données d'exemple.