The JSON Formatter extension helps developers debug Javascript code more efficiently while making text strings more readable. JSON files consist of English language-based text strings without line breaks. Programmers use the JSON Formatter to present their code in a way that makes their computer language easier to understand.
To access and use the JSON Formatter extension for Chrome, follow these four easy steps.
Install the JSON Formatter Chrome extension
Start by accessing the JSON Formatter extension. You’ll need to be on the Chrome browser to install this extension.
Confirm the JSON extension is valid
Once you’ve enabled the JSON Formatter Chrome extension, use the interactive JSON Schema validator to view your source code and ensure that the JSON document you want to format is valid. JSON documents contain text, curly braces, square brackets, double quotes, commas, and potentially single quotes, depending on developer preference. Objects housed within curly braces represent multiple pairs and values.
Verify the JSON text is readable online
Access the Enterprise Explorer view within your Javascript development environment. This custom view displays all your current projects with Java EE extensions. Right-click on your .json file or any other text string that contains valid JSON code and choose Open With > JSON Editor. This compresses your JSON strings, displaying them on a single line while removing the white space between JSON elements.
Test the JSON Formatter application
Once you’ve verified the source code is valid and properly formatted, insert the document into the visible text and the web page, and select the Format JSON button. The app will display the text in the desired format, making it easier to read. You can opt to reverse your changes and send the code back to its original space-saving form by entering it in the text field and clicking the Un-Format JSON button.
The extension works with local files as well after your enable it in chrome://extensions. To inspect the JSON document, simply type in JSON into the console. If you want to view the formatting pane open the view dropdown and select Format current view. You’ll notice a simplified View formatting that separates List and Gallery formatting layouts for JSON. The shortcut Ctrl+Shift+I lets you format your JSON document from the context menu.
View our list of the 10 best Chrome extensions for boosting developer productivity.
