DEV Community

Quack Quack
Quack Quack

Posted on

I have created a json inspecting tool. What do you think?

As a back-end developer, when someone ask me why something doesn't work on the UI or something in particular doesn't show incorrect data on the UI. The first thing i do is to open the Developer Console on the browser and capture the response from the API. Then i inspect that JSON and find some particular field doesn't meet the requirements or the data doesn't meet some specific criteria.

The thing is, inspecting the data using the browser "Ctrl+F" shortcut or copy the whole JSON string then go to VScode or some online json formatter just to find out you have to go through each item in the array of 10 items but has lots of field is very painful. There are other cases where you want to sum a particular field of an array just to get the sum so you could tell if the Front-end guy is calculating the whole thing incorrectly or you are which i find Ctrl+f and json formatter doesn't help at all. So, i created an web app using React js to solve this problem.

Basically, this website let you input the raw json string and do quick filter, mapping, counting on the provided string in a pipeline fashion. Here's some screenshots

Image description

Image description

Image description

Here's the link to the page: https://json-pipe.pages.dev/
This is just the prototype of the project, i will add more feature to make it able to perform complex operators, please tell me what you think and what i should improve 😉.

Top comments (0)