As great as working with semi-structured data can be, the non-human readable format of files (such as JSON) can make their analysis really complicated. Fortunately, Prettier.io created a Visual Studio Code extension called Prettier - Code Formatting which allows VSC users to format their files instantly, making them easy to analyse!
So... what is Prettier?
Prettier is an code formatter that supports many languages including JavaScript, TypeScript, HTML, CSS, JSON, YAML, Markdown, and more! In a nutshell, it enforces a consistent style by parsing your code and reprinting it with its own rules - making it legible to humans.
Let's take a look at an example:
This is a JSON file with data taken from the TfL Bike Point API. Despite my best efforts, its current lack of formatting makes it really hard for me to read. This is when Prettier comes in.
With the extension installed, all it took was to save the file - resulting in the same file being formatted in a easily readable, human-friendly format!
Ok, how do I get started?
Install the Prettier Extension
1. Open the Extensions panel in VS Code (Ctrl+Shift+X)
2. Search for “Prettier - Code formatter” A tick mark next to Prettier as the published is what you want to look for
3. Open the page and click Install
Enable Format on Save (Recommended if you want Prettier to work automatically)
- Open
Settings(Ctrl+,) - Search for
Format On Save - Check the box
