Introduction
If you are into tech or programming, chances are pretty high that you know the term JSON. It is a widely used text data format to exchange information between two devices over the internet or other medium of communication. JSON is becoming extremely popular in the recent past because of its simplicity, wide acceptance and lightweight nature. It came as a superior alternative to XML. JSON is used in several applications such as API request/response, holding tax information, data for communicating between two programming languages, software configurations, preferences setting, web app data, crypto information, and the list is infinite. All of them, and several others, uses JSON format to store and transmit information. Every programmer/developer must know about JSON.
In this section, you will learn a quick introduction of JSON, what it is, how to use them, and most importantly, how to view the JSON data in a much cleaner way using open source Notepad++ text editor. Listed below are simple prerequisites for this tutorial.
Prerequisites
- Notepad++ installed
- Internet connection
- Sample JSON data/file
Table of contents
- What is JSON?
- Why do you need to format a JSON file
- View JSON data in notepad++
- Other alternative tools to view JSON data
- Further
What is JSON?
JSON stands for JavaScript Object Notation. It is a text format and not a programming language. Although it contains the word JavaScript, that’s a programming language, it is not associated with JavaScript only, since it is derived from the JavaScript object hence the word javascript in the name. All modern programming language knows about JSON.
A dedicated video on this topic is available on aipython’s youtube channel. Find the same video embedded with this post.
Let’s see some of the salient features of JSON which makes it more popular and useful.
- JSON is a lightweight data-interchange format (lightweight means overhead of the data is very less so that it can be exchanged between the two devices having lower bandwidth as well)
- JSON is a collection of name and value pairs (it is similar to the dictionary in Python but the format is a little bit different)
- Easy for both human and machine to parse (or read) the information
- It is a text format that is completely language independent
- Almost every programming language can easily understand and interpret JSON data.
JSON data can have the object, which is placed under the curly braces, array/list, numbers (int, float), strings, boolean and even null values.
The very first thing that you will notice with any JSON data is, complete information is enclosed within a pair of curly braces. This is the super important thing right the first thing, it should be within the curly braces. Let’s look at one of the snippets of JSON data (a tiny one). I have applied some colour combinations so that it is easy for you to understand a respective section.
Why do you need to format JSON?
Raw JSON data is hard to read for us humans, but when we format the data using already available tools such as notepad++, which is an open-source text editor, reading data become much easier.
Let’s look at the two same data side by side. Both are in JSON format and represent the same data. The data appearing on the left side is in the raw state, looks very clumsy (you will get easily intimidated by it), however, when you look toward the right the same data appears to give a lot more sense after applying simple formatting. The left side data is raw JSON data and on the right is well-formatted JSON data.
Now you can realize the importance of formatting JSON data. It gives a better sense by just looking at the data.
View JSON data on Notepad++
Notepad++ is an open-source text editor that supports the writing/editing of over 40 programming languages. There are a lot of advantages offered by this tool. A detailed article is available to read – Notepad++ for Python. I would recommend checking out the article as you will get a better understanding of the tool. Even if you are not using Python, do check out because all the features will remain the same for other programming languages. Now, let’s look at how can you use this tool to view/format JSON files/data quickly. You need to install a free plugin called json viewer.
Installing the plugin (JSON viewer) in notepad++
JSON viewer plugin formats the raw data into a structured hierarchical view as well as it also provides an additional option to view the data in a tree-based structure. It all takes a few steps to find and install this plugin in notepad++. Navigate to ‘Plugin’ tool in the main toolbar and click over it. Select ‘Plugin admin..’ and click on it.
Main toolbar -> Plugin -> Plugin-admin..
This will open up a Plugin Admin window. Now search for json viewer, it will show up the corresponding plugin in the list, as shown in the image below. Select the plugin (using the checkbox) and click on the install button located on the right side. It will ask for some confirmation just click on yes and go ahead.
Please note that the Notepad++ editor will get close automatically, installs the plugin and relaunches itself (all this happens in just 4-7 seconds)
Format JSON data using JSON viewer
Once the plugin is installed, it will show up in the plugin tab. Next, you have to do is either copy any JSON data or load a JSON file by dragging it in notepad++. All data will appear in a single line. Now, JSON viewer will help you to format the data. Go to plugin and select JSON viewer and then select ‘Format JSON’, that’s it. You will notice that the data gets formatted and a clear structure of the complete data is available on the screen.
View JSON tree structure using – show JSON viewer
This step is optional but very useful. For smaller JSON files, you have to make one or two scrolls (sometimes no scroll) in order to view complete data on the same screen but for bigger files, it is really hard to read the data by keeps on scrolling continuously. Here comes the role of ‘show json viewer’, it generates a tree structure of the complete data and makes it appear in the separate window along the left side of the screen. You can expand and collapse any/all portion of the JSON.
Other alternatives to view JSON data
There are various other alternatives to view JSON data in a well-formatted way, which are
- Webbrowser (especially Google Chrome using an extension)
- VS Code, VIM
- Various online web apps
- Jupyter Notebook etc.
Further
I am pretty sure that you have learnt something new in this tutorial. I would strongly suggest you follow along with this tutorial and try to visualize at least one or two files. You can download a sample file or can create one by yourself, which can be used in this exercise.
If you feel this content is worth reading then do share this content among your network & it helps us a lot.
Keep Learning and Keep Growing !!
