JSON files are human-readable that user can read them easily.

Actually, it's easy for developers, but not for everyone. The better way is to make it a diagram. I found the open-source project called JSON Crack on GitHub that can make you a beautiful diagram from your JSON data. You can use it on both jsoncrack website and on locally docker.

You can try it on jsoncrack webite

https://jsoncrack.com/editor

Example JSON data

example-data.json

{
  "squadName": "Super hero squad",
  "homeTown": "Metro City",
  "formed": 2016,
  "secretBase": "Super tower",
  "active": true,
  "members": [
    {
      "name": "Molecule Man",
      "age": 29,
      "secretIdentity": "Dan Jukes",
      "powers": [
        "Radiation resistance",
        "Turning tiny",
        "Radiation blast"
      ]
    },
    {
      "name": "Madame Uppercut",
      "age": 39,
      "secretIdentity": "Jane Wilson",
      "powers": [
        "Million tonne punch",
        "Damage resistance",
        "Superhuman reflexes"
      ]
    },
    {
      "name": "Eternal Flame",
      "age": 1000000,
      "secretIdentity": "Unknown",
      "powers": [
        "Immortality",
        "Heat Immunity",
        "Inferno",
        "Teleportation",
        "Interdimensional travel"
      ]
    }
  ]
}

Run locally with Docker

Create Dockerfile

Dockerfile

# Builder
FROM node:14-buster as builder
WORKDIR /src
COPY . /src
RUN yarn install --legacy-peer-deps
RUN yarn run build

# App
FROM nginxinc/nginx-unprivileged
COPY --from=builder /src/out /app
COPY default.conf /etc/nginx/conf.d/default.conf

Build Docker image with docker build -t jsoncrack .
Run locally with docker run -p 8888:8080 jsoncrack

Refference

https://github.com/AykutSarac/jsoncrack.com