Chrome Extension For Json Formatter

Almost every website is data-driven, which means that there’s a ton of data to collect and process, even if it’s just to tell you what’s on the screen. Most of the time, sites are going to be using JSON or JavaScript Object Notation format to store and exchange data, so being able to read this code is essential if you’re going to understand what needs to be included in your content brief.

Chrome Extension For Json Formatter

Makes JSON easy to read. Open source.

FEATURES
   •   JSON & JSONP support
   •   Syntax highlighting
   •   Collapsible trees, with indent guides
   •   Clickable URLs
   •   Toggle between raw and parsed JSON
   •   Works on any valid JSON page – URL doesn't matter
   •   Works on local files too (if you enable this in chrome://extensions)
   •   You can inspect the JSON by typing "json" in the console

(Note: this extension might clash with other JSON highlighters/beautifiers, like ‘JSONView’, ‘Pretty JSON’ or ‘Sight’ – disable those before trying this.)

Try it out on these URLs:

http://graph.facebook.com/coca-cola?callback=whatever
http://gdata.youtube.com/feeds/api/standardfeeds/most_popular?alt=json&v=2
http://feeds.delicious.com/v2/json/popular?callback=hello

PRO TIP
Hold down control (or cmd on Mac) while collapsing a tree if you want to collapse all its siblings too.

PRIVACY
No tracking, no advertising, and nothing else nefarious.

SOURCE CODE
github.com/callumlocke/json-formatter

BUGS/SUGGESTIONS
github.com/callumlocke/json-formatter/issues

json formatter chrome how to use

The JSON format is derived from Javascript and is often used to transmit data between a server and web application. It is an alternative to XML that a programmer can dabble at, using any number of tools. But what if you want to use your browser? There are several web apps and extensions for Google Chrome aimed at helping programmers edit JSON files.

JSON Formatter (app)

The JSON Formatter Chrome app was created to help programmers debug code. Often text in JSON files is typed without line breaks as a means of saving space. JSON Formatter tries to assist coders by formatting the code in a way that makes it easier to read. Just insert code into the single box visible on the web page and press the “Format JSON” button. The desired re-formatted text will be displayed below. An “Un-Format JSON” button is available to edit JSON files back to their space-saving original form.

JSON Formatter (extension)

The JSON Formatter Chrome extension, which has no relation to the Chrome app, is an open source tool that also makes reading JSON code easier on the eyes. It touts support for both JSON and JSONP formats and offers syntax highlighting, collapsible trees, indent guides, and clickable URLs. It works on any valid JSON page and on local files as well. The screenshot above displays JSON Formatter in action, while the screenshot below shows how the code looks without the extension installed.

JSON Editor

JSON Editor is a tool for viewing, editing, and formatting JSON. This Chrome app opens a text editor inside your browser, allowing you to edit code without having to switch to another application. The app displays two text fields side by side. The field on the left displays the code as it is, while the field on the right displays the text in a more readable format. The app can open both local files and urls. Its source code is also available for those who want to know how the sauce is made.

JSONView

JSONView for Google Chrome originated as a Firefox extension. It comes complete with context menu options for copying a JSON path or value. There is also a built-in style editor for customizing the theme. An extension produced by another developer, JSONView and JSONLint for Google Chrome, expands on JSONView extension’s ability to validate JSON documents using JSONLint. And speaking of JSONLint …

JSONLint

The JSONLint Chrome app is fairly straightforward. It opens up the JSONLint website where you can validate JSON documents. It can also reformat JSON documents if needed. The app adds offline functionality, which is a nice touch. Like most of the options on this page, the app is open source, and the source code is available for anyone who wants to check it out.

Conclusion

If you are an experienced programmer, you probably already have an established workflow. But if you are tinkering with JSON documents for the first time or just want additional tools for interacting with documents in your browser, you have plenty of options. You do not have to use a dedicated JSON editor to edit JSON files, and if you already have a preferred way of interacting with such files, let us hear about it in the comments below.

Conclusion

Let us know your thoughts in the comment section below.

Check out other publications to gain access to more digital resources if you are just starting out with Flux Resource.
Also contact us today to optimize your business(s)/Brand(s) for Search Engines