JSON Formatter

JSON Formatter

JSON Formatter

Formatted JSON:

Formatting JSON (JavaScript Object Notation) involves structuring it to be easily readable and properly organized. Here’s a guide to formatting JSON:

What is JSON?

JSON is a lightweight data interchange format that’s easy for humans to read and write, and easy for machines to parse and generate. It is often used for configuration files, data exchange between a server and a web application, and more.

Basic Structure of JSON

JSON data is represented in key-value pairs and can be organized into objects and arrays:

  • Object: Encased in curly braces {}. Contains key-value pairs.
  • Array: Encased in square brackets []. Contains a list of values.

Example:

{
"name": "John",
"age": 30,
"city": "New York",
"hobbies": ["reading", "travelling"],
"address": {
"street": "5th Avenue",
"number": 10
}
}

Steps to Format JSON

  1. Indentation:
    • Use spaces or tabs to indent nested objects and arrays to improve readability.
    • Standard practice is to use 2 or 4 spaces for indentation.
  2. Consistent Key-Value Formatting:
    • Ensure that each key is a string enclosed in double quotes.
    • Separate keys and values with a colon :.
    • Each key-value pair should be followed by a comma, except the last one in an object or array.
  3. Line Breaks:
    • Use line breaks to separate each key-value pair and each level of nesting.

Manual Formatting

You can manually format JSON by following these principles:

Example: Original JSON (Minified):

{"name":"John","age":30,"city":"New York","hobbies":["reading","travelling"],"address":{"street":"5th Avenue","number":10}}

Formatted JSON:

{
"name": "John",
"age": 30,
"city": "New York",
"hobbies": [
"reading",
"travelling"
],
"address": {
"street": "5th Avenue",
"number": 10
}
}

 

  1. Text Editors and IDEs:
    • Many text editors and IDEs have built-in features or plugins to format JSON.
    • Visual Studio Code: Use the built-in formatter with Shift + Alt + F.
    • Notepad++: Install the JSTool plugin and use the “Format JSON” feature.
    • Sublime Text: Use the Package Control to install the Pretty JSON plugin and format your JSON.
  2. Command Line Tools:
    • Python:
      import json
      data = '{"name":"John","age":30,"city":"New York"}'
      parsed = json.loads(data)
      formatted = json.dumps(parsed, indent=4)
      print(formatted)
    • jq (Command-line JSON processor):
      jq . file.json

Summary

Formatting JSON improves readability and helps avoid errors in data handling. By using proper indentation, line breaks, and consistent formatting, you can ensure your JSON data is well-structured and easy to understand. You can also leverage various tools and editors to automate the formatting process.