Elevate Your JSON Formatting Experience: Meet the Privacy-Focused Companion Tool

Last updated Jun 30, 2023 Published Oct 24, 2021

The content here is under the Attribution 4.0 International (CC BY 4.0) license

Recently I have been working on a simple app with one goal in mind: format json content locally, without the need to access a third party website for that.

The answer that that is json-tool, a electron based app that formats json content with a click of a button, or just pasting the desired json. It offers a 100% offline experience once it’s installed and the most important: there is no track, ads or anything related to data. Privacy first.

Besides that, it was an excuse to practice my outside-in TDD (Test Driven Development) skills (TDD is a subject of interest to me), I used cypress and React Testing Library just for that.

The tool is available at snapcraft.io.

My old workflow

My day-to-day work requires sometimes, handling jsons to mitigate bugs or to integrate with third party services. Usually when that is the case, the first step is to get to know the data structure of the json content or it’s content. For that I used different tools in order to format the content and make it human readable, this approach is applicable in the following scenarios:

  1. Fetching json from logs.
  2. Copying json from documentation (usually brings formatted HTMl or other things).
  3. Scaping json to remove extra slashes from the content.

Achieving that is easy, I was able to, googling json prettier for example and clicking on the first link, usually I was using the following websites to format json content:

Even though, those websites are free to use, the first two also relies on ads. Besides, there is no guarantee of having the data pasted there being collected for further use (those websites offer a terms of use to make it clear what they do with your data, but still, its a relationship that we need to trust the service).

Try it out

The json-tool is available on github and can be used as a PWA or installed via snapcraft.

The new workflow

To start developing this app, privacy was in the first place, I wanted to have a tool that I could use locally and trust that no data would be collected or used.

THe workflow from the previous section stills the same, I amusing the tool to mitigate some bug or to integrate with a third party service, but now I know that everything is offline - It might benefits enterprise developers that usually work on sensitive data..

For today’s need, I often open the json-tool and leave it there, once I need some formatting I just click the button “paste from clipboard”.

json-tool opened

If I try to use something that is not a valid json content, it will warn me with a message in the bottom.

json-tool validation

All in all, there are a lot to improve and features to add, but this is the minimum that I needed to kickoff the tool and share with the community.

Future work

The tool is just starting and I hope to improve the amount of features available with it, along those lines, some challenges around mocking the browser clipboard API also came around (I think this is something that deserves a post for itself). On the short term I see the following:

  • Enable more fine grained formatting (number of spaces, choosing between spaces X tabs)
  • Upload a file to be formatted
  • Keep the history of formatted content and allow the user to navigate between them
  • Enable keyboard shortcut instead of rely only on buttons

For further details, I would recommend to follow the github repository that holds the source code and the tasks being addressed in the project. For any suggestion or feedback, whatever it might be, leave a comment in the section bellow or ping me any time.