JSON is everywhere. It's the data format behind REST APIs, configuration files, local storage, and more. Yet one of the most common developer frustrations is staring at a wall of unindented JSON trying to figure out what's wrong with it. This guide covers everything you need to know about JSON formatting — from what it means to how to do it instantly online.
What Is JSON Formatting?
Formatting JSON means adding whitespace — indentation and newlines — to make the structure visually clear. The same data can be represented two ways:
Minified (compact):
{"name":"Alice","age":30,"roles":["admin","editor"]}
Pretty-printed (formatted):
{
"name": "Alice",
"age": 30,
"roles": [
"admin",
"editor"
]
}
Both are 100% valid JSON. The difference is readability. Minified JSON is ideal for network transfer — fewer bytes sent. Pretty-printed JSON is ideal for humans — debugging, code review, and documentation.
Why Formatting Matters
Debugging is faster. When an API returns 3 KB of nested JSON on one line, finding the field you care about takes minutes. Formatted JSON lets you scan hierarchy instantly.
Code review is cleaner. Git diffs on formatted JSON show exactly which values changed. A minified diff is nearly unreadable.
Errors are easier to spot. Malformed JSON — a missing comma, an extra brace — stands out immediately in a well-indented structure.
Documentation is self-explanatory. Formatted JSON in READMEs and API docs communicates structure without prose.
JSON Syntax Rules
Before formatting, it helps to know what makes JSON valid:
| Construct | Rule |
|---|---|
| Keys | Must be double-quoted strings: "name" not name |
| Strings | Must use double quotes: "hello" not 'hello' |
| Numbers | No quotes needed: 42, 3.14, -7 |
| Booleans | Lowercase only: true or false |
| Null | Lowercase: null |
| Arrays | Comma-separated values in [] |
| Objects | Comma-separated key-value pairs in {} |
| Trailing commas | Not allowed — the last item must have no trailing comma |
Common JSON Errors and How to Fix Them
1. Trailing Comma
// ❌ Invalid
{
"name": "Alice",
"age": 30,
}
// ✅ Valid
{
"name": "Alice",
"age": 30
}
2. Single-Quoted Strings
// ❌ Invalid — JavaScript allows this, JSON does not
{ 'name': 'Alice' }
// ✅ Valid
{ "name": "Alice" }
3. Unescaped Special Characters
// ❌ Invalid — newline must be escaped
{ "message": "Hello
World" }
// ✅ Valid
{ "message": "Hello\nWorld" }
Common escape sequences: \" (quote), \\ (backslash), \n (newline), \t (tab), \r (carriage return).
4. Missing Commas Between Items
// ❌ Invalid
{
"name": "Alice"
"age": 30
}
// ✅ Valid
{
"name": "Alice",
"age": 30
}
5. Comments in JSON
JSON does not support comments. // comment and /* comment */ will cause a parse error. If you need comments in config files, consider JSONC (JSON with Comments) or JSON5, which are supersets of JSON supported by some tools.
How to Format JSON Online
The fastest way to format JSON is with DevZone's JSON Formatter:
- Paste your raw or minified JSON into the input panel.
- The formatter validates and pretty-prints it instantly with 2-space indentation.
- If there's a syntax error, the exact line and position are highlighted.
- Copy the formatted result or use the "Minify" toggle to compact it again.
The tool works entirely in your browser — no data is sent to a server.
When to Minify vs Pretty-Print
| Scenario | Use |
|---|---|
| Sending API responses in production | Minify — reduces payload size |
| Debugging API responses locally | Pretty-print — scan quickly |
| Storing JSON in a database text column | Minify — saves storage |
| Config files checked into git | Pretty-print — readable diffs |
| Documentation and README examples | Pretty-print — self-documenting |
FAQ
Can you format JSON in VS Code?
Yes. Open a .json file, then press Shift+Alt+F (Windows/Linux) or Shift+Option+F (Mac) to auto-format. VS Code uses a built-in JSON language server. You can also right-click and choose Format Document.
How do you format JSON in Python?
import json
raw = '{"name":"Alice","age":30}'
parsed = json.loads(raw)
formatted = json.dumps(parsed, indent=2)
print(formatted)
How do you format JSON in Node.js?
const raw = '{"name":"Alice","age":30}';
const parsed = JSON.parse(raw);
const formatted = JSON.stringify(parsed, null, 2);
console.log(formatted);
The second argument to JSON.stringify is a replacer (pass null to include all fields), and the third is the indentation level (2 spaces is the most common convention).
What's the difference between JSON and JSON5?
JSON5 is a superset of JSON that relaxes some restrictions: it allows single-quoted strings, trailing commas, unquoted keys, comments, and multi-line strings. JSON5 is useful for human-edited config files but is not supported by standard JSON.parse().
Is formatted JSON larger than minified JSON?
Yes — whitespace adds bytes. For a 1 KB minified JSON, the formatted version might be 1.5–2× larger. In production APIs, always send minified JSON. Pretty-printing is a developer convenience tool.