Menu

JSONFold: Format, validate, and explore JSON in your browser
📰

JSONFold: Format, validate, and explore JSON in your browser

DEV Community: javascript·Abhishek Deshmukh·about 15 hours ago
#7gl8G6N2
#devtojavascript#devto#dev#name#json
Reading 0:00
15s threshold

JSONFold is my personal project: a free browser-based tool for formatting, validating, and exploring JSON. Here’s a quick walkthrough using fictional order data.

From compact JSON to readable data

Compact API responses can be difficult to scan:

{ "order" :{ "id" : 1042 , "customer" :{ "name" : "Alex Example" , "city" : "Maple Bay" }, "items" :[{ "name" : "Keyboard" , "quantity" : 2 },{ "name" : "Mouse" , "quantity" : 1 }], "paid" : true }}

Enter fullscreen mode

Exit fullscreen mode

Paste the JSON into Source and click Prettify to make its structure easier to read:

{ "order" : { "id" : 1042 , "customer" : { "name" : "Alex Example" , "city" : "Maple Bay" }, "items" : [ { "name" : "Keyboard" , "quantity" : 2 }, { "name" : "Mouse" , "quantity" : 1 } ], "paid" : true } }

Enter fullscreen mode

Exit fullscreen mode

Explore nested objects and arrays

Switch to Structure to explore the JSON as a collapsible tree.

Click the arrows beside objects and arrays to expand or collapse them.

Click Expand all to…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.