JSON Lens
JSON Lens is an open-source data visualization app which allows visualization of JSON in the form of interactive graphs. It works in Web and VSCode.
Web
VSCode
Features
- Dark/Light mode
- Graph mode
- Export JSON
- Download graphs in PNG, SVG and JPEG formats
- Zoom and panning support
- Import Data from URLs or File System
- PWA Support
Tech Stack
- Next.js – Framework
- TypeScript – Language
- Tailwind – CSS
- Turborepo – Monorepo
- ReactFlow - Visualization
- Zustand - State Management
- Vercel – Deployments
Roadmap
- Support other formats like YAML, TOML and XML
- Show Node Details like json path
- Offline Support
Feel free to create an issue for feature requests or suggestions.
⭐️ Show Your Support
Please give a ⭐️ if this project helped you!
Resources
Shared my learnings on how I built the application in this playlist