Many modern applications interact with endpoints to send and receive data from a remote network server. Tools such as Proxyman allow you to intercept the content when as you request data from an endpoint, and then view and alter the returned JSON. But what if you haven't written any code yet and need to see what an endpoint returns? Or you need to view and edit a local JSON file in a structured and validated form?
The JSON Editor application, available on the Mac App Store, allows you to do that with a convenient and easy to use interface. It's free for use, although you can tip to support the continued development of the tool.
The application supports two modes: client and editor.
HTTP Client
The HTTP Client mode allows making a request to a web server and then view the returned data. This is ideal for exploring an API an endpoint.
HTTP Request Tab
The list on the left allows creating and storing multiple requests, making it easy to switch between endpoints without reentering the same request repeatedly.
The possible request methods are supported: GET, POST, PUT, DELETE, PATCH, HEAD, OPTIONS, and TRACE. The POST and PUT request methods allow you to specify custom header fields if your endpoint requires them.
OAuth credentials can also be specified, and the inspector provides the ability to provide and edit all the necessary fields.
Clicking the Send Request button sends the request to the server and then switches to the HTTP Response tab to show the results.
HTTP Response Tab
The three parts of the response are displayed: the response code, the headers, and the body of the response. The returned JSON is formatted using the beautify button. Or, by clicking the Open in JSON Document button you can open the content in the built-in editor.
JSON Editor
The JSON editor makes it easy to edit and view content from a request, a file on disk, or from create JSON from scratch.
Outline View
The outline view is quite similar to the Xcode plist editor and provides an excellent way to visualize the overall JSON structure. The JSON key, and associated value type, and value, are displayed in separate columns. You add values of any supported JSON types: Array, Object, String, Null, Number, and Boolean by clicking the + button. The value editor column type-checks the value after editing to ensure that it is a valid value.
You can also switch the editor to a textual editing mode. This is a validating, syntax-highlighted view of the same date, in either a compact format (no returns) or readable format ( as shown above) .
Clicking the Validate button checks the validity of the JSON and provides highlighting of any errors, as well as a description of the issue.
Wrap up
JSON Editor is a great addition to your developer toolbox and I've found it indispensable when working with new endpoints and with JSON data in general. The client capabilities on their own are powerful and, when combined with the editor, it makes a complete tool for working with JSON.
JSON Editor on the Mac App Store
sanguish on Mastodon
