DEV Community

Dipankar Das
Dipankar Das

Posted on

Tired of messy JSON? I made a tool that visualizes your data as both a tree and a pannable graph. ๐Ÿš€

Hey everyone! ๐Ÿ‘‹

Iโ€™ve always found it a bit painful to debug deeply nested JSON files, so I decided to build my own visualizer. Instead of just a boring list, I wanted something more interactive and visual.

I call it JSON Tree Viewer.

Live Demo: https://debabratasaha-dev.github.io/JSON-tree-viewer/
GitHub Repo: https://github.com/debabratasaha-dev/JSON-tree-viewer

Key Features:
๐Ÿ•ธ๏ธ Dual View: Switch between a classic interactive Tree View and a zoomable Graph View.
๐Ÿ” Interactive Graph: Drag, pan, and zoom to explore complex JSON structures visually.
๐ŸŽจ Modern UI: Built with a glassmorphism sidebar, smooth animations, and a sleek dark mode.
๐Ÿท๏ธ Smart Tagging: Automatically detects data types (Strings, Numbers, Objects, etc.) with clean icons.
๐Ÿš€ Lightweight: Zero heavy frameworksโ€”just pure HTML, CSS, and JavaScript.
Iโ€™d love to hear your feedback! What features should I add next? If you find it useful, Iโ€™d really appreciate a โญ๏ธ on GitHub!

Top comments (0)