README.md

<a href="https://jsoncrack.com/" target="_blank" rel="noopener">
    <img alt="JSON Crack" w src="https://user-images.githubusercontent.com/47941171/236689277-0fa9e50a-3106-4854-a2d4-bb5722f16d48.png" />
</a>


<h4 align="center">
  <a href="https://jsoncrack.com">JSON Crack</a> |
  <a href="https://marketplace.visualstudio.com/items?itemName=AykutSarac.jsoncrack-vscode">VS Code Extension</a> |
  <a href="https://jsoncrack.com/docs">Documentation</a> 
</h4>

<div align="center">
  <h2>
    An innovative, open source data visualization app.
    <br />
    Brings data to life through captivating graphs.
  </h2>
</div>

<br />
<p align="center">
  <a href="https://www.producthunt.com/posts/json-crack?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-json&#0045;crack" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=332281&theme=light" alt="JSON&#0032;Crack - Simple&#0032;visualization&#0032;tool&#0032;for&#0032;your&#0032;JSON&#0032;data&#0046; | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
    <a href="https://discord.gg/yVyTtCRueq" target="_blank"><img src="https://user-images.githubusercontent.com/47941171/206397224-94da03a4-59d0-48cd-aafc-512624a768d6.png" "style=" height: 54px;" height="54" /></a>
    </br>
    <a href="https://github.com/sponsors/AykutSarac" target="_blank"><img src="https://user-images.githubusercontent.com/47941171/206397875-a4e73f02-5d8f-4db0-902b-9a4bc2b22d90.png" "style=" height: 54px;" height="54" /></a>
  </p>

<p align="center">
  <img src="./public/assets/jsoncrack-screenshot.jpeg" alt="Product Preview" />
</p>

# JSON Crack (jsoncrack.com)

JSON Crack is a free, open-source data visualization app capable of visualizing data formats such as JSON, YAML, XML, CSV and more, into interactive graphs. With its intuitive and user-friendly interface, JSON Crack makes it easy to explore, analyze, and understand even the most complex data structures. Whether you're a developer working on a large-scale project or a data enthusiast looking to uncover hidden insights, JSON Crack has the tools and features you need to unlock the full potential of your data.

## Features
- 💯 Free & open-source.
- 🌓 Dark mode.
- 🖼️ Export to PNG, SVG, JPEG & clipboard.
- 🔍 Zoom and panning support with touch gestures.
- 🛠 Wide range of tools - search, json path, node contents, expand/toggle, auto format...
- 🔗 Share/Import/Fetch
- 🧱 Embeddable iframe widgets.

## Contributing

- Missing something or found a bug? [Report here](https://github.com/AykutSarac/jsoncrack.com/issues).
- Want to contribute? Check out our [contribution guide](https://github.com/AykutSarac/jsoncrack.com/blob/main/CONTRIBUTING.md) or let us know on [Discord](https://discord.gg/yVyTtCRueq).

## Sponsors & support

If you like the project, you can become a sponsor at [GitHub Sponsors](https://github.com/sponsors/AykutSarac) or use [Premium](https://jsoncrack.com/pricing).

## Running Locally
 
### Local

After cloning the repository, run the following commands:
```console
# Install the packages
pnpm install

# Start development server
# Then the development server will run at http://localhost:3000
pnpm dev
```

### Docker

🐳 A [`Dockerfile`](Dockerfile) is provided in the root of the repository.
If you want to run JSON Crack locally:

```console
# Build a Docker image with:
docker build -t jsoncrack .

# Run locally with `docker run`
docker run -p 8888:8080 jsoncrack

# Run locally with `docker-compose`
docker-compose up -d

# Go to http://localhost:8888
```

## Thank you for supporting JSON Crack

Last but not least, we're thankful to these companies for offering their services for free:

<a href="https://sentry.io">
  <img height="30" src="https://user-images.githubusercontent.com/47941171/236691121-717c7975-809f-4508-b58e-5ada2f7e8c7c.png" alt="Sentry" />
</a>
pinned: false