Repolode
Submit
AykutSarac

AykutSarac/jsoncrack.com

Open-source JSON editor that turns JSON, YAML, CSV and XML into interactive graphs, with format conversion and code generation.

Open-source alternative to:Oracle JSON Viewer

View on GitHubWebsite
Stars
44,515
Forks
3,577
Open issues
46
Last commit
last month

What is it?

JSON Crack visualizes structured data such as JSON, YAML, CSV and XML as interactive graphs or trees, making nested data easier to explore, format and validate. It runs as a web app, a VS Code extension, a Chrome extension, and an npm package named jsoncrack-react.

Beyond visualization, the tool converts between formats such as JSON to CSV or XML to JSON, and generates TypeScript interfaces, Golang structs, Kotlin data classes, Rust serde types and JSON Schema. It can also run jq and JSONPath queries, and export a visualization as PNG, JPEG or SVG.

All data processing happens locally in the browser, so input is not stored on external servers. The web app is built with Next.js and React, and can be run locally with pnpm or Docker.

Key features

  • 01Visualizes JSON, YAML, CSV and XML as interactive graphs or trees.
  • 02Converts between formats such as JSON to CSV and XML to JSON.
  • 03Generates TypeScript, Golang, Kotlin, Rust types and JSON Schema.
  • 04Runs jq and JSONPath queries on the data.
  • 05Exports visualizations as PNG, JPEG or SVG.

Use cases

  • Exploring large or deeply nested API responses.
  • Quickly converting data between JSON, CSV and XML.
  • Generating typed models from sample JSON payloads.
  • Using the VS Code extension to inspect JSON files inside the editor.

Quick start

  1. 1

    Clone the repository

    git clone https://github.com/AykutSarac/jsoncrack.com.git
  2. 2

    Go to the project folder

    cd jsoncrack.com
  3. 3

    Install packages with pnpm

    pnpm install
  4. 4

    Run the web app, then open http://localhost:3000/

    pnpm dev:www

Things to know

  • Requires Node.js 24 or newer and pnpm 10 or newer to run from source.
  • The README covers only source setup; no packaged desktop installer is described.

Topics

#json#visualization#yaml#csv#xml#json-schema#code-generation#nextjs#diagrams#graph

FAQ

What is jsoncrack.com?
Open-source JSON editor that turns JSON, YAML, CSV and XML into interactive graphs, with format conversion and code generation. JSON Crack visualizes structured data such as JSON, YAML, CSV and XML as interactive graphs or trees, making nested data easier to explore, format and validate. It runs as a web app, a VS Code extension, a Chrome extension, and an npm package named jsoncrack-react.
Is jsoncrack.com free to use? What license does it have?
jsoncrack.com is open source under the Apache-2.0 license. Check the license terms before using it in commercial products.
Is jsoncrack.com still maintained?
Updated within 6 months. The last commit to jsoncrack.com was on Sep 14, 2026.
What can I use jsoncrack.com for?
Exploring large or deeply nested API responses. Quickly converting data between JSON, CSV and XML. Generating typed models from sample JSON payloads. Using the VS Code extension to inspect JSON files inside the editor.
How do I install jsoncrack.com?
Clone the repository: git clone https://github.com/AykutSarac/jsoncrack.com.git Go to the project folder: cd jsoncrack.com Install packages with pnpm: pnpm install Run the web app, then open http://localhost:3000/: pnpm dev:www
Where can I get jsoncrack.com?
The source code and installation instructions are on GitHub: https://github.com/AykutSarac/jsoncrack.com

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects