Learn JSON

JSON Learning Center

Guides by the JSON Formatter Hub team.

Start with the basics of JSON, then move into API response formatting, invalid JSON repair, AI-generated JSON cleanup, debugging, comparing files, and quick-reference material. These guides are written for developers, testers, students, and anyone who needs to work with JSON.

New to JSON? Start here

These four guides take you from zero to confidently working with JSON in APIs and code:

1. What Is JSON? — syntax, data types, objects, arrays, and where JSON appears in the real world.
2. How to Format JSON — pretty-printing, minification, indentation, and when each format is appropriate.
3. Common JSON Errors — the mistakes that appear most often and exactly how to fix them.
4. Format API Response JSON — applying everything to real-world REST API output.

Already comfortable with JSON?

Skip ahead to the guides that match where you are:

• Fix Invalid JSON — repair malformed data from any source quickly
• Fix AI-Generated JSON — clean up output from ChatGPT, Claude, Cursor, and other AI tools
• How to Compare JSON — diff two JSON files and spot changes between API versions
• JSON vs XML — understand why modern APIs switched from XML to JSON
• JSON Cheatsheet — keep the syntax rules and escape sequences within reach

What JSON looks like

JSON is built from two structures: objects (key-value pairs inside curly braces {}) and arrays (ordered lists inside square brackets []). Values can be strings, numbers, booleans, null, nested objects, or arrays.

{
  "user": {
    "id": 42,
    "name": "Deepak Kumar",
    "active": true,
    "roles": ["admin", "developer"],
    "address": null
  }
}

The guide What Is JSON? walks through every part of this syntax in detail, including data types, nesting rules, and real-world examples.

Quick answers to common JSON questions

What is JSON used for?

JSON is the standard data format for REST APIs, configuration files, browser storage (localStorage), NoSQL databases, and data exchange between services. If a web app talks to a server, that exchange is almost certainly in JSON.

Is JSON the same as a JavaScript object?

No, though the syntax looks similar. A JavaScript object can have functions, comments, and unquoted keys. JSON is stricter: all keys must be double-quoted strings, values must be one of six types, and there are no comments or trailing commas allowed. Use JSON.parse() to convert a JSON string into a JavaScript object and JSON.stringify() to convert back.

Why is my JSON invalid?

The most common causes are a trailing comma after the last item in an object or array, single quotes instead of double quotes around keys or strings, an unquoted key, a comment left inside the JSON, or a missing or extra bracket. Paste your JSON into the formatter to see the exact line and character where the problem is.

Does JSON support comments?

No. Standard JSON does not allow comments. If you need comments in a config file, look at JSONC (used in VS Code settings) or JSON5. To use those formats with a standard parser, strip the comments first.

What is the difference between pretty-printed and minified JSON?

Pretty-printed JSON adds indentation and line breaks so humans can read it easily. Minified JSON strips all unnecessary whitespace to reduce file size. Use pretty-printed when debugging or reviewing data; use minified when sending data over the network. The JSON Formatter Hub switches between both formats instantly.

Who these guides are for

• Frontend and backend developers working with REST APIs, GraphQL, or any JSON-based data source
• QA engineers and testers inspecting API responses and comparing payloads between environments
• Data analysts processing JSON exports from databases, analytics platforms, or third-party tools
• Students and beginners learning web development and encountering JSON for the first time
• DevOps and platform engineers working with JSON-based config files, infrastructure-as-code, and structured log output

The six JSON data types

Every value in JSON must be one of exactly six types. Knowing these types is the single most important thing to understand before working with any JSON data.

1. String

Any text wrapped in double quotes. Strings can contain letters, numbers, spaces, and special characters. Single quotes are not allowed — only double quotes are valid in JSON.

"name": "Deepak Kumar"
"city": "New Delhi"
"message": "Hello, World!"

2. Number

Any integer or decimal number. No quotes around it. JSON does not distinguish between integers and floats — both are just "number". Very large or very small numbers can use scientific notation.

"age": 28
"price": 99.99
"temperature": -12.5
"distance": 1.5e10

3. Boolean

Exactly two possible values: true or false. Both must be lowercase — True or FALSE will cause a parse error.

"isActive": true
"isDeleted": false

4. Null

Represents the intentional absence of a value. Must be written as lowercase null. Useful for fields that exist in a schema but have no value yet, like an optional phone number or an unset expiry date.

"middleName": null
"deletedAt": null

5. Object

A collection of key-value pairs wrapped in curly braces {}. Keys must be strings (double-quoted). Values can be any of the six JSON types, including another object. Objects can nest as deeply as needed.

"address": {
  "street": "12 MG Road",
  "city": "Bangalore",
  "pincode": "560001"
}

6. Array

An ordered list of values wrapped in square brackets []. Items are separated by commas. An array can contain any mix of types — strings, numbers, objects, even other arrays.

"tags": ["javascript", "api", "tutorial"]
"scores": [98, 87, 74, 91]
"users": [
  { "id": 1, "name": "Priya" },
  { "id": 2, "name": "Rahul" }
]

JSON syntax rules

JSON has a strict set of rules. Even one small mistake makes the entire document invalid. These are the rules you must follow:

• Keys must be double-quoted strings. { name: "Priya" } is invalid. { "name": "Priya" } is correct.
• No trailing commas. The last item in an object or array must not have a comma after it. { "a": 1, } is invalid.
• No comments. // this is a comment and /* block comment */ are both illegal inside JSON.
• Strings must use double quotes. Single-quoted strings like 'hello' are not valid JSON.
• Numbers must not be quoted. "age": "28" makes age a string, not a number.
• Booleans and null are lowercase. True, False, NULL are all invalid.
• All brackets and braces must be closed. Every { needs a matching }. Every [ needs a matching ].

Here is a side-by-side example of invalid and valid JSON:

// INVALID JSON
{
  name: 'Priya',          // unquoted key, single-quoted value
  age: 25,               // trailing comma after last item
  active: True,          // boolean must be lowercase
  // this is a comment   // comments not allowed
}

// VALID JSON
{
  "name": "Priya",
  "age": 25,
  "active": true
}

How to read and write JSON in JavaScript

In JavaScript (and most other languages), JSON is always handled as a string when it travels over the network or gets stored. You must convert it to a usable object before you can work with its values.

JSON.parse() — convert a JSON string into an object

Use JSON.parse() any time you receive JSON from an API, read it from a file, or load it from localStorage.

const jsonString = '{"name":"Priya","age":25,"roles":["admin","editor"]}';

const user = JSON.parse(jsonString);

console.log(user.name);       // "Priya"
console.log(user.age);        // 25
console.log(user.roles[0]);   // "admin"

JSON.stringify() — convert an object into a JSON string

Use JSON.stringify() any time you want to send data to an API, save it to localStorage, or write it to a file. The optional second and third arguments control filtering and indentation.

const user = { name: "Priya", age: 25, roles: ["admin", "editor"] };

// compact (for sending over the network)
const compact = JSON.stringify(user);
// '{"name":"Priya","age":25,"roles":["admin","editor"]}'

// pretty-printed (for logging or saving to a file)
const pretty = JSON.stringify(user, null, 2);
// {
//   "name": "Priya",
//   "age": 25,
//   "roles": [
//     "admin",
//     "editor"
//   ]
// }

Accessing nested JSON values

Use dot notation for known keys and bracket notation for dynamic keys or keys that contain special characters.

const data = {
  "order": {
    "id": 1042,
    "customer": { "name": "Rahul", "city": "Mumbai" },
    "items": [
      { "product": "Keyboard", "qty": 1 },
      { "product": "Mouse", "qty": 2 }
    ]
  }
};

console.log(data.order.id);                    // 1042
console.log(data.order.customer.name);         // "Rahul"
console.log(data.order.items[0].product);      // "Keyboard"
console.log(data.order.items[1].qty);          // 2

Where JSON appears in real projects

Once you know JSON, you will start seeing it everywhere. Here are the most common places you will encounter it:

• REST API responses — any request to a web API (GitHub, Stripe, Twitter, Google Maps, weather APIs) returns a JSON body. You parse it with JSON.parse() or fetch's response.json().
• Configuration files — package.json defines a Node.js project's name, version, and dependencies. tsconfig.json configures TypeScript. .eslintrc.json configures linting rules. All are JSON files.
• Browser localStorage and sessionStorage — browsers only store strings, so JSON.stringify() before saving and JSON.parse() after retrieving is the standard pattern.
• NoSQL databases — MongoDB stores documents as BSON (a binary form of JSON). Firebase Firestore, DynamoDB, and CouchDB all use JSON-like document structures.
• Log files — structured logging tools (like Winston, Pino, or Logstash) write log entries as JSON objects so they can be queried and filtered programmatically.
• Data exchange between microservices — when one service calls another inside a backend system, the request and response bodies are almost always JSON.
• GitHub and CI/CD pipelines — GitHub Actions workflow files are YAML, but the GitHub API and webhooks return JSON. Many build tools (like turbo.json, Vercel config) are also JSON files.

JSON vs other data formats

JSON is not the only way to represent structured data. Here is how it compares to the other formats you are likely to encounter:

JSON vs XML

XML was the dominant data format before JSON. JSON replaced it in most APIs because it is more compact, easier to read, and directly usable in JavaScript. XML still appears in SOAP APIs, RSS feeds, SVG files, and Android layouts. See the full comparison in JSON vs XML.

/* Same data in XML */
<user>
  <name>Priya</name>
  <age>25</age>
</user>

/* Same data in JSON */
{ "name": "Priya", "age": 25 }

JSON vs YAML

YAML is popular for config files (Kubernetes, Docker Compose, GitHub Actions) because it supports comments and is easier to write by hand. However, YAML's indentation-sensitive syntax makes it prone to hard-to-spot errors. JSON is safer for data that machines generate and consume. Every valid JSON file is also valid YAML.

# Same data in YAML
name: Priya
age: 25
roles:
  - admin
  - editor

// Same data in JSON
{ "name": "Priya", "age": 25, "roles": ["admin", "editor"] }

JSON vs CSV

CSV (comma-separated values) works well for flat, tabular data like spreadsheets or database exports. It has no support for nested structures. JSON handles nested and hierarchical data naturally, which is why APIs use JSON instead of CSV. When data is deeply nested (like an order with multiple line items, each with its own details), JSON is the only practical choice.

The most common JSON mistakes and how to fix them

If you are new to JSON, these are the errors you are most likely to make. Each one will cause a parse error:

• Trailing comma — { "a": 1, "b": 2, } — remove the comma after the last value.
• Single quotes — { 'name': 'Priya' } — change all single quotes to double quotes.
• Unquoted key — { name: "Priya" } — add double quotes around the key: "name".
• Comment inside JSON — { "a": 1 // comment } — delete the comment entirely.
• Undefined value — { "value": undefined } — JSON has no undefined. Use null or remove the key.
• Missing comma between items — { "a": 1 "b": 2 } — add a comma after 1.
• Mismatched brackets — { "items": [1, 2, 3 } — the array is closed with } but should be ].

Paste any broken JSON into the formatter and it will highlight the exact line and character that caused the error.