Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/AykutSarac/jsoncrack.com?utm_campaign=buffer&utm_content=buffer51d6c&utm_medium=social&utm_source=linkedin.com
✨ Innovative and open-source visualization application that transforms various data formats, such as JSON, YAML, XML, CSV and more, into interactive graphs.
https://github.com/AykutSarac/jsoncrack.com?utm_campaign=buffer&utm_content=buffer51d6c&utm_medium=social&utm_source=linkedin.com
csv diagrams graph json nextjs react tool visualization yaml
Last synced: 3 months ago
JSON representation
✨ Innovative and open-source visualization application that transforms various data formats, such as JSON, YAML, XML, CSV and more, into interactive graphs.
- Host: GitHub
- URL: https://github.com/AykutSarac/jsoncrack.com?utm_campaign=buffer&utm_content=buffer51d6c&utm_medium=social&utm_source=linkedin.com
- Owner: AykutSarac
- License: gpl-3.0
- Created: 2022-01-30T15:25:18.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-03-16T20:44:59.000Z (4 months ago)
- Last Synced: 2024-03-19T06:06:13.728Z (4 months ago)
- Topics: csv, diagrams, graph, json, nextjs, react, tool, visualization, yaml
- Language: TypeScript
- Homepage: https://jsoncrack.com/
- Size: 14 MB
- Stars: 28,227
- Watchers: 137
- Forks: 1,619
- Open Issues: 48
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Lists
- awesome-sources - JSON Crack - Simple JSON visualization tool for your data. (Tools)
README
JSON Crack (formerly JSON Visio)
The open-source JSON Editor.
Learn more »
Discord
·
Website
·
Issues
·
VS Code
## About the Project
# More Than a JSON Editor
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.
- Dark mode.
- Graph & Tree view modes.
- Transform & filter data with AI.
- Export to PNG, SVG, JPEG & clipboard.
- Zoom and panning support with touch gestures.
- Supports data formats like JSON, YAML, CSV, XML, TOML...
- JQ, JSON Schema, Decode JWT, Generate Types and interfaces.
- Wide range of tools - search graph, json path, validate, save to cloud...
- Embeddable iframe widgets.
## Recognition
### Built With
- [Next.js](https://nextjs.org/?ref=jsoncrack.com)
- [Reaflow](https://reaflow.dev/?ref=jsoncrack.com)
- [React.js](https://reactjs.org/?ref=jsoncrack.com)
- [Tailwind CSS](https://mantine.dev/?ref=jsoncrack.com)
- [Supabase](https://supabase.com/?ref=jsoncrack.com)
## Stay Up-to-Date
JSON Crack officially launched as v1.0 on the 17th of February 2022 and we've come a long way so far. Watch **releases** of this repository to be notified of future updates:
## Getting Started
To get a local copy up and running, please follow these simple steps.
### Prerequisites
Here is what you need to be able to run JSON Crack.
- Node.js (Version: >=18.x)
- Pnpm _(recommended)_
## Development
### Setup
1. Clone the repo into a public GitHub repository (or fork https://github.com/AykutSarac/jsoncrack.com/fork). If you plan to distribute the code, keep the source code public to comply with [GPLv3](https://github.com/AykutSarac/jsoncrack.com/blob/main/LICENSE). To clone in a private repository, [acquire a commercial license](mailto:[email protected])
```sh
git clone https://github.com/AykutSarac/jsoncrack.com.git
```
2. Go to the project folder
```sh
cd jsoncrack.com
```
3. Install packages with yarn
```sh
pnpm install
```
4. Run the project
```sh
pnpm dev
# Running on http://localhost:3000/
```
### 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
```
## Contributing
Please see our [contributing guide](/CONTRIBUTING.md).
### Good First Issues
We have a list of [help wanted](https://github.com/AykutSarac/jsoncrack.com/issues?q=is:issue+is:open+label:%22%F0%9F%99%8B%F0%9F%8F%BB%E2%80%8D%E2%99%82%EF%B8%8Fhelp+wanted%22) that contain small features and bugs which have a relatively limited scope. This is a great place to get started, gain experience, and get familiar with our contribution process.
### Contributors
## License
Distributed under the [GPLv3 License](https://github.com/AykutSarac/jsoncrack.com/blob/main/LICENSE). See `LICENSE` for more information.