Outil de visualisation et d’édition JSON
(github.com/podosoft-dev)Bonjour
J’utilisais depuis longtemps, de temps en temps, plusieurs JSON Viewer gratuits, mais je trouvais toujours qu’il leur manquait un peu quelque chose.
Je me suis donc appuyé sur plusieurs projets open source pour en créer un basé sur Svelte5.
Les principales fonctionnalités sont les suivantes :
- validation syntaxique et formatage JSON en temps réel
- visualisation graphique interactive en structure arborescente
- accès immédiat à l’emplacement JSON en cliquant sur un nœud
- récupération de données JSON depuis une URL (
GET/POST/PUT/DELETE/PATCH) - réduction automatique au-delà de 20 éléments (fonction « voir plus »)
- prise en charge du coréen et de l’anglais
Je l’ai créé pour visualiser facilement des structures JSON complexes ou pour analyser des réponses d’API.
Liens :
- Démo : https://json.podosoft.io
- GitHub : https://github.com/podosoft-dev/pdjsoneditor
Vos retours sont les bienvenus !
Merci.
15 commentaires
Je vois souvent des structures JSON complexes et profondément imbriquées, donc ce genre d’outil est vraiment très utile haha. Est-ce que vous envisagez éventuellement d’en faire aussi une application desktop ? Un peu dans l’esprit de Sublime, haha.
Actuellement en cours de planification
Vous avez donc utilisé xyflow. J’ai du mal à trouver des idées en utilisant des organigrammes, mais c’est vraiment sympa.
Waouh ! C’est justement ce qui me manquait au quotidien, et c’est vraiment très clair visuellement !
Beau travail.
Cela pourra aussi aider les débutants en Kotlin.
Merci !
Ce serait bien si JSON5 était également pris en charge !
Vous avez fait du vibe coding ?
Oui, j’ai principalement utilisé Claude Code, et lorsque je bloquais par moments, je vérifiais sur ChatGPT ; ce qui ne fonctionnait toujours pas, je l’analysais moi-même directement dans le code pour déterminer la direction de la correction, puis je redonnais des instructions à Claude Code.
En particulier, lors de l’application de Dagre, le problème de chevauchement des nœuds du graphe était impossible à résoudre malgré tous mes efforts, donc j’ai dû le déboguer moi-même et le corriger.
Grâce à toute cette série de processus, j’ai l’impression d’avoir beaucoup appris sur les limites de ces outils et sur la manière de formuler les consignes de travail.
Waouh, c'est sympa.
En revanche, il semble qu'on ne puisse pas se déplacer en cliquant sur un nœud.
C’est désormais corrigé.
Après vérification du cas que vous avez mentionné, j’ai constaté que dans certains cas le nœud est déplacé, tandis que dans d’autres non. Je vais vérifier cela et essayer de le corriger.
Personnellement, il m'arrive assez souvent de devoir manipuler du JSON échappé, donc ce serait bien d'ajouter aussi une fonction d'échappement JSON !
D’accord, je vais l’examiner en tenant compte de cela.
C’est vraiment excellent !! Si c’était aussi compatible avec Yaml et TOML, je pense que je l’utiliserais souvent.
Je n’avais pas pensé à YAML ni à TOML, merci de l’avoir signalé. Nous allons étudier l’ajout de cette fonctionnalité et voir comment la mettre en place.