Outils de développeur·7 min

Bonnes pratiques de formatage JSON pour les développeurs

Maîtrisez les bonnes pratiques JSON : évitez les erreurs courantes, validez, embellissez et domptez les API avec des exemples concrets.

Qu'est-ce que JSON et pourquoi le formatage compte ?

JSON (JavaScript Object Notation) est le format d'échange de données de facto du web. Il est léger, lisible, et quasiment tous les langages le prennent en charge nativement. Que vous construisiez une API REST, stockiez de la configuration ou fassiez transiter des données entre un frontend et un backend, JSON est presque toujours le choix par défaut.

Mais « lisible » dépend de la manière dont vous l'écrivez. Une seule ligne de JSON minifié peut faire 4 Ko ; les mêmes données joliment indentées avec deux espaces peuvent faire 8 Ko. Les deux sont valides. La différence, c'est si le prochain développeur — vous-même y compris — pourra le lire à 2 h du matin pendant un incident.

Un bon formatage n'est pas qu'une question d'esthétique. Il impacte directement :

  • La débogabilité : un payload joliment formaté révèle la structure d'un coup d'œil. Les objets imbriqués se parcourent facilement, les clés manquantes sautent aux yeux, et les fautes de frappe se voient immédiatement.
  • La lisibilité du diff : relire du code sur du JSON minifié est inutile. Un diff avec deux espaces d'indentation montre clairement quels champs ont changé.
  • La localisation des erreurs : quand le parsing échoue, les numéros de ligne et de colonne n'ont de sens que si le document a une mise en page réelle.
  • La collaboration : un style cohérent dans l'équipe évite à quiconque de perdre du temps à reformater des fichiers avant de pouvoir travailler dessus.

En résumé, le formatage est une forme de communication. Traitez votre JSON comme vous traitez votre code.

Les erreurs JSON les plus courantes

Même des développeurs chevronnés font ces fautes. Elles sont valides en JavaScript, c'est pourquoi l'éditeur ne les signale pas.

Virgules traînantes

Une virgule après le dernier élément d'un tableau ou d'un objet est parfaitement valide en JavaScript. JSON ne l'autorise pas.

```json // INVALIDE { "name": "Ada", "age": 36, } ```

La correction est triviale : retirez la virgule. La plupart des linters la détectent. Si le vôtre ne le fait pas, changez-en.

Guillemets simples pour les chaînes

Les chaînes JSON doivent utiliser des guillemets doubles. Les guillemets simples sont une convention JavaScript, pas JSON.

```json // INVALIDE { 'name': 'Ada' } ```

On tombe souvent dans ce piège en copiant une valeur depuis un littéral d'objet JavaScript ou un dictionnaire Python affiché avec des guillemets simples. Utilisez toujours des guillemets doubles, pour les clés comme pour les valeurs textuelles.

Clés non entourées de guillemets

Les clés JSON doivent être des chaînes, et les chaînes doivent être entre guillemets.

```json // INVALIDE { name: "Ada" } ```

Commentaires

JSON ne supporte pas les commentaires. Ni `//` ni `/ /` ne seront parsés. Si vous avez besoin d'annotations, utilisez un champ `"_comment"`, un fichier d'accompagnement, ou passez à JSON5/JSONC — mais uniquement côté producteur, car la plupart des consommateurs attendent du JSON strict.

Accolades et crochets dépareillés

Un `}` manquant ou un `]` en trop est la cause la plus fréquente de « Unexpected end of JSON input » et autres erreurs similaires. Embellir est la façon la plus rapide de les repérer : vos yeux verront le déséquilibre immédiatement.

Comment valider du JSON

La validation se décline en deux catégories : syntaxique (est-ce du JSON bien formé ?) et sémantique (correspond-il au schéma attendu ?).

Pour la validation syntaxique, n'importe quel éditeur moderne fait le travail. VS Code surligne en rouge le JSON malformé. L'outil CLI `jq` vous indique dès le premier caractère fautif. Les validateurs en ligne fonctionnent, mais attention aux données sensibles — ne collez que des échantillons non sensibles.

Pour la validation sémantique, il vous faut un JSON Schema (voir plus bas) ou un parseur typé dans votre langage. En TypeScript, des bibliothèques comme `zod` ou `io-ts` permettent de décrire la forme attendue et de rejeter tout ce qui ne correspond pas. Cela attrape la pire classe de bug : l'API renvoie silencieusement un nouveau champ, ou un ancien champ devient `null`, et votre code plante trois niveaux plus bas.

Un bon flux de travail :

  1. Embellissez le JSON entrant pendant le débogage.
  2. Validez par rapport à un schéma à la frontière de votre système (contrôleur, client API, gestionnaire de messages).
  3. Ne faites confiance à rien à l'intérieur de la frontière.

Embellir ou minifier

Ce sont les deux faces d'une même pièce, et les deux sont utiles — simplement à des endroits différents.

Embellir (aussi « beautify » ou « expand ») ajoute l'indentation et les sauts de ligne. À utiliser pour :

  • Les fichiers source versionnés dans git
  • Les réponses d'API que vous inspectez en développement
  • Les entrées de log que vous pourriez avoir à relire
  • La documentation et les exemples

Minifier supprime tous les espaces. À utiliser pour :

  • Les réponses d'API en production
  • Les tokens et cookies (JWT, stockage de session)
  • Le stockage dans des bases ou caches à l'espace limité
  • Les charges réseau où chaque byte compte

Règle pratique : embellir en développement, minifier en production. La plupart des outils de build le font automatiquement. Pour le ponctuel, un formateur JSON gratuit gère les deux directions en un seul copier-coller.

Pour comparer deux documents JSON, un outil de diff texte mettra en évidence exactement les champs qui ont changé — bien plus utile que de plisser les yeux sur une sortie minifiée.

Travailler avec des données imbriquées

Les objets et tableaux imbriqués sont l'endroit où brille l'expressivité de JSON — et où les bugs aiment se cacher.

Quelques principes :

  • Gardez un imbrication peu profonde. Trois niveaux, c'est bien. Cinq niveaux, il faut probablement modéliser les données sous forme de liste plate avec des clés étrangères, ou répartir sur plusieurs endpoints.
  • Soyez cohérent entre tableaux et objets. Un champ qui est tantôt un tableau, tantôt `null`, est une source classique de `Cannot read property 'map' of null`. Décidez à l'avance : s'il n'y a pas d'éléments, renvoyez `[]`, pas `null`.
  • Utilisez un ordre de clés stable quand cela compte. JSON n'impose pas l'ordre des clés, mais les parseurs et outils de diff se comportent mieux avec un ordre prévisible. L'alphabétique est une valeur par défaut sûre.
  • Méfiez-vous des très grands tableaux. Un blob JSON de 50 Mo contenant un million d'éléments dans un tableau est techniquement valide mais impossible à streamer. Envisagez NDJSON (un objet JSON par ligne) ou une API paginée.

JSON dans les API : content-type et codes de statut

Si vous construisez des API HTTP, deux en-têtes font presque tout le travail :

  • `Content-Type: application/json` — indique au client (et à tout intermédiaire) à quoi s'attendre. L'oublier est le bug d'API le plus fréquent en production.
  • `Accept: application/json` — ce que le client est prêt à recevoir. Utile pour la négociation de contenu.

Côté réponse, faites correspondre le code de statut au résultat :

  • `200 OK` — succès, le corps contient la ressource ou le résultat.
  • `201 Created` — une nouvelle ressource a été créée ; l'en-tête `Location` doit la pointer.
  • `204 No Content` — succès, pas de corps (fréquent pour DELETE).
  • `400 Bad Request` — la requête est mal formée (JSON invalide, champ requis manquant).
  • `401 Unauthorized` — pas d'identifiants valides.
  • `403 Forbidden` — identifiants valides mais droits insuffisants.
  • `404 Not Found` — la ressource n'existe pas.
  • `422 Unprocessable Entity` — JSON valide mais sémantiquement incorrect (ex. âge négatif).
  • `500 Internal Server Error` — quelque chose a explosé côté serveur. Ne jamais exposer la stack trace.

Un schéma courant consiste à envelopper les réponses : `{ "data": ..., "error": null }` ou `{ "data": null, "error": { "code": "...", "message": "..." } }`. C'est bien, mais pas obligatoire. L'un ou l'autre vaut mieux que des formes ad hoc incohérentes.

Bases de JSON Schema

JSON Schema est un vocabulaire qui permet de décrire la forme et les contraintes d'un document JSON. Pensez-y comme au système de types de JSON.

Un schéma minimal :

```json { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "required": ["name", "age"], "properties": { "name": { "type": "string", "minLength": 1 }, "age": { "type": "integer", "minimum": 0 } } } ```

Cela dit : le document doit être un objet avec un `name` non vide et un `age` entier non négatif. On peut l'étendre avec des formats (`"format": "email"`), des enums, des regex et des références à d'autres schémas.

Pourquoi s'embêter ? Valider à la frontière empêche les données douteuses de se propager. Le schéma sert aussi de documentation vivante : il décrit ce que votre API accepte réellement, pas ce que quelqu'un croit qu'elle accepte.

Quasiment tous les langages disposent d'un validateur JSON Schema. Dans l'écosystème TypeScript, des outils comme `zod` sont de plus en plus populaires car ils génèrent pour vous les types TypeScript à partir du schéma.

Pièges classiques avec dates, nombres et caractères spéciaux

JSON est volontairement minimaliste. Il n'a pas de type date, et ça piége tout le monde.

  • Dates : stockez-les en chaînes ISO 8601 (`"2026-02-01T12:00:00Z"`). Évitez les formats type `"02/01/2026"` — ambigus et dépendants de la locale.
  • Nombres : les nombres JSON sont décimaux. Il n'existe pas de type entier. En JavaScript, les entiers au-dessus de 2^53 perdent en précision. Pour des ID ou des montants, préférez les chaînes.
  • Booléens : uniquement les littéraux `true` et `false`. Une chaîne comme `"true"` n'est pas convertie automatiquement.
  • Unicode : les chaînes JSON sont Unicode, donc les emojis et les caractères CJK passent directement. Mais les séquences d'échappement comptent : `\n` est un saut de ligne, `\\` est un antislash, `\u0041` est `A`. En cas de doute, collez vos données dans un formateur JSON et inspectez les octets bruts.
  • Null vs. absent : `{"age": null}` et `{}` ne veulent pas dire la même chose. Décidez dans votre système lequel représente « inconnu », et tenez-vous-y.

Des outils qui vous font gagner du temps

Un bon formateur est l'un de ces outils dont on ne réalise pas le besoin avant d'y avoir goûté. Notre formateur JSON gratuit s'exécute entièrement dans votre navigateur — pas d'envoi, pas d'inscription, pas de pistage. Collez un payload minifié, obtenez un arbre lisible, recopiez. Il valide en même temps qu'il formate, donc les erreurs de syntaxe apparaissent en ligne, avec un pointeur sur le caractère fautif.

Pour comparer deux versions d'un document JSON — par exemple avant et après une migration — l'outil de diff texte fait le même travail pour n'importe quel texte brut, avec une mise en évidence ligne par ligne.

Tous deux font partie d'un ensemble plus large d'outils de développeur pensés pour ces utilitaires rapides dans le navigateur que vous utilisez des dizaines de fois par jour.

Conclusion

Le formatage JSON est l'une de ces petites disciplines qui s'accumulent sur la durée d'un projet. Embellir en développement, minifier en production. Valider à la frontière. Utiliser des schémas quand les données dépassent l'usage ponctuel. Stocker les dates en ISO 8601, les grands nombres en chaînes, et traiter `null` avec intention.

Rien de tout cela n'est glamour. Mais tout cela vous fera gagner des heures de débogage la prochaine fois que quelque chose casse — et quelque chose casse toujours. La bonne nouvelle, c'est qu'avec un formateur et un schéma sous la main, la correction est souvent à un seul copier-coller.