DevToys Web Pro iconDevToys Web Pro블로그
평가하기:
브라우저 확장 프로그램을 사용해 보세요:
← Back to Blog

Dev Blog: JSON, SQL, and XML Formatters for Clean Code

7 min read

Formatting JSON, SQL queries, and XML documents is one of the most frequent tasks in development. Minified API responses, compressed configuration files, and single-line SQL queries are nearly impossible to debug without proper formatting.

This guide covers the essential code formatters developers use daily — explaining when to beautify, when to minify, and how proper formatting improves code quality and debugging efficiency.


JSON Formatting & Validation

JSON (JavaScript Object Notation) is the universal data interchange format for web APIs, configuration files, and data storage. A JSON formatter transforms minified JSON into readable, indented output — and vice versa.

Beautifying Minified JSON

API responses and production configs are often minified to reduce size. When debugging, you need to pretty print JSON to understand the structure:

// Minified (hard to read)
{"users":[{"id":1,"name":"Alice","roles":["admin","user"]},{"id":2,"name":"Bob","roles":["user"]}],"meta":{"total":2,"page":1}}

// Beautified (readable)
{
  "users": [
    {
      "id": 1,
      "name": "Alice",
      "roles": ["admin", "user"]
    },
    {
      "id": 2,
      "name": "Bob",
      "roles": ["user"]
    }
  ],
  "meta": {
    "total": 2,
    "page": 1
  }
}

Minifying JSON for Production

For APIs and storage, minification removes unnecessary whitespace and reduces payload size:

  • Removes all indentation and line breaks
  • Eliminates spaces after colons and commas
  • Typically reduces JSON size by 10-30%
  • Improves transfer speeds and reduces bandwidth costs

JSON Validation & Syntax Checking

A JSON validator catches syntax errors that break parsers:

// Common JSON errors

// Trailing comma (invalid JSON)
{ "name": "Alice", }

// Single quotes (invalid JSON)
{ 'name': 'Alice' }

// Unquoted keys (invalid JSON)
{ name: "Alice" }

// Missing comma
{ "name": "Alice" "age": 30 }

// Valid JSON uses double quotes, no trailing commas
{ "name": "Alice", "age": 30 }

Escaping and Unescaping JSON Strings

When JSON is embedded in other JSON (common in logging), strings get double-escaped. To unescape JSON strings:

// Double-escaped JSON string (from logs)
"{\"user\":\"alice\",\"action\":\"login\"}"

// After unescaping
{"user":"alice","action":"login"}

// Then beautify for readability
{
  "user": "alice",
  "action": "login"
}

The JSON Formatter handles beautification, minification, and validation with syntax error highlighting.


SQL Query Formatting

Complex SQL queries become unreadable when written on a single line or with inconsistent formatting. A SQL formatter applies consistent indentation and keyword capitalization.

Formatting Single-Line Queries

-- Before formatting (hard to read)
SELECT u.id, u.name, u.email, COUNT(o.id) as order_count FROM users u LEFT JOIN orders o ON u.id = o.user_id WHERE u.status = 'active' AND u.created_at > '2024-01-01' GROUP BY u.id, u.name, u.email HAVING COUNT(o.id) > 5 ORDER BY order_count DESC LIMIT 100;

-- After formatting (readable)
SELECT
  u.id,
  u.name,
  u.email,
  COUNT(o.id) AS order_count
FROM users u
LEFT JOIN orders o
  ON u.id = o.user_id
WHERE u.status = 'active'
  AND u.created_at > '2024-01-01'
GROUP BY
  u.id,
  u.name,
  u.email
HAVING COUNT(o.id) > 5
ORDER BY order_count DESC
LIMIT 100;

SQL Formatting Conventions

  • Keywords uppercase — SELECT, FROM, WHERE, JOIN, ORDER BY
  • Clause alignment — Each major clause starts a new line
  • Column lists — One column per line for long SELECT lists
  • JOIN conditions — ON clause indented under JOIN
  • Subquery indentation — Nested queries indented consistently

Formatting Subqueries and CTEs

-- Common Table Expression (CTE) formatting
WITH active_users AS (
  SELECT
    id,
    name,
    email
  FROM users
  WHERE status = 'active'
),
recent_orders AS (
  SELECT
    user_id,
    COUNT(*) AS order_count
  FROM orders
  WHERE created_at > CURRENT_DATE - INTERVAL '30 days'
  GROUP BY user_id
)
SELECT
  au.name,
  au.email,
  COALESCE(ro.order_count, 0) AS recent_orders
FROM active_users au
LEFT JOIN recent_orders ro
  ON au.id = ro.user_id
ORDER BY recent_orders DESC;

When to Use SQL Formatting

  • Debugging slow queries — structure reveals logic issues
  • Code reviews — consistent format makes diffs readable
  • Documentation — formatted queries in technical docs
  • Migration scripts — complex ALTER and CREATE statements
  • Stored procedures — multi-statement SQL blocks

The SQL Formatter supports MySQL, PostgreSQL, SQL Server, and standard SQL syntax with configurable indentation.


XML Formatting & Prettifying

XML documents from SOAP APIs, configuration files, and data exports are often minified or poorly formatted. An XML formatter adds proper indentation and line breaks.

Beautifying Minified XML

<!-- Minified XML (unreadable) -->
<?xml version="1.0"?><catalog><book id="1"><title>Clean Code</title><author>Robert Martin</author><price>35.99</price></book><book id="2"><title>The Pragmatic Programmer</title><author>David Thomas</author><price>49.99</price></book></catalog>

<!-- Formatted XML (readable) -->
<?xml version="1.0"?>
<catalog>
  <book id="1">
    <title>Clean Code</title>
    <author>Robert Martin</author>
    <price>35.99</price>
  </book>
  <book id="2">
    <title>The Pragmatic Programmer</title>
    <author>David Thomas</author>
    <price>49.99</price>
  </book>
</catalog>

XML Formatting Scenarios

  • SOAP API responses — Debug complex XML payloads
  • Maven pom.xml — Clean up dependencies and plugins
  • Android layouts — Format XML layout files
  • SVG files — Inspect and edit vector graphics
  • .NET configs — web.config, app.config formatting
  • RSS/Atom feeds — Debug feed structure

Minifying XML for Production

Like JSON, XML can be minified to reduce file size for transmission:

  • Removes indentation and unnecessary whitespace
  • Preserves whitespace inside text content when significant
  • Maintains XML declaration and namespaces
  • Reduces size for SOAP requests and large XML documents

XML Namespaces and Complex Documents

<!-- Namespaced XML (common in SOAP) -->
<soap:Envelope
  xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
  <soap:Header>
    <auth:Token xmlns:auth="http://example.com/auth">
      abc123
    </auth:Token>
  </soap:Header>
  <soap:Body>
    <api:GetUser xmlns:api="http://example.com/api">
      <api:UserId>42</api:UserId>
    </api:GetUser>
  </soap:Body>
</soap:Envelope>

The XML Formatter handles namespaces, CDATA sections, and preserves document structure while formatting.


Formatting Best Practices

When to Beautify

  • Debugging — Always format data when troubleshooting
  • Code reviews — Formatted code is easier to review
  • Documentation — Include formatted examples in docs
  • Configuration — Human-edited files should be readable
  • Version control — Consistent format improves diffs

When to Minify

  • API payloads — Reduce transfer size
  • Production configs — When not human-edited
  • Embedded data — Data URLs, inline scripts
  • Storage optimization — Database JSON columns

Indentation Standards

FormatCommon StandardNotes
JSON2 spacesJavaScript/Node.js convention
SQL2-4 spacesTeam preference varies
XML2-4 spacesMatch project conventions

Formatter Quick Reference

TaskToolFeatures
JSON beautify/minifyJSON FormatterIndent, minify, validate, sort keys
SQL query formattingSQL FormatterMulti-dialect, keyword case, indentation
XML prettify/minifyXML FormatterNamespace support, CDATA handling

Related Tools

Formatters work alongside other data tools:


All Formatters in DevToys Web Pro

These formatters are part of the Formatters collection in DevToys Web Pro. All formatting happens in your browser — no code is sent to external servers.

Open Formatters →