What Is JSON? The Data Format Explained Simply

Every API speaks JSON. Every config file is JSON. If you're working with app development, web development, or anything that involves data, you'll encounter JSON. And the best part: it's really not hard to understand. Five minutes, and you can read and write JSON.

I work with JSON every single day -- in API responses, configuration files, databases. It's the lingua franca of modern software development.

Quick Summary

• JSON stands for JavaScript Object Notation -- a text-based, human-readable data format
• JSON knows objects {}, arrays [], strings, numbers, booleans, and null
• It's the standard for API communication and configuration files
• JSON is language-independent and supported by every programming language
• Common mistakes: trailing commas, single quotes, comments (all not allowed)

The Shipping Label of the Software World

Imagine a package being sent from Germany to Japan. The label shows sender, recipient, weight, contents -- all in a standardized format that any shipping carrier worldwide can read. Whether it's DHL, FedEx, or Japan Post.

JSON is exactly that kind of standardized label -- just for data. Whether your server runs Python, your app is written in Flutter, and your frontend uses React: they all understand JSON. It's the universal data format the software world has agreed upon.

What Is JSON?

JSON stands for JavaScript Object Notation. Despite the name, JSON isn't limited to JavaScript. It's an independent, text-based data format that can be read and written by any programming language.

The idea behind it: exchange data in a format that is both human-readable and machine-processable. And JSON achieved exactly that. It's simpler than XML, more readable than binary formats, and supported everywhere.

JSON was popularized by Douglas Crockford in the early 2000s and has since become the standard for data exchange on the web. When you call an API today, you'll get JSON back in 99% of cases.

JSON Syntax: The Basics

JSON knows exactly six data types. That's it. No classes, no inheritance, no magic.

Objects

A JSON object is a collection of key-value pairs enclosed in curly braces {}:

{
  "name": "Maximilian",
  "age": 28,
  "developer": true
}

Every key is a string in double quotes. The value can be any JSON type.

Arrays

An array is an ordered list of values enclosed in square brackets []:

{
  "languages": ["Dart", "JavaScript", "TypeScript", "Python"]
}

Strings

Always in double quotes. Single quotes are not allowed:

{
  "message": "Hello World"
}

Numbers

Integers and decimals, without quotes:

{
  "price": 49.99,
  "quantity": 3
}

Booleans

true or false, lowercase, without quotes:

{
  "active": true,
  "deleted": false
}

Null

The value "nothing", lowercase:

{
  "phone": null
}

Practical Example: A User Profile as JSON

Here's what a typical user profile looks like, as an API might return it:

{
  "id": 42,
  "username": "max_dev",
  "email": "max@example.com",
  "profile": {
    "firstName": "Maximilian",
    "lastName": "Flechtner",
    "avatar": "https://example.com/avatars/42.webp",
    "bio": "App developer by passion"
  },
  "settings": {
    "theme": "dark",
    "language": "en",
    "notifications": true
  },
  "projects": [
    {
      "name": "My First App",
      "technology": "Flutter",
      "status": "live"
    },
    {
      "name": "Portfolio Website",
      "technology": "Nuxt",
      "status": "in-development"
    }
  ],
  "createdAt": "2024-03-15T10:30:00Z"
}

Look at how readable that is. Objects within objects, an array of projects, different data types -- and you immediately understand what the data means. That's the power of JSON.

JSON in Practice

JSON is everywhere. Here are the three most common use cases:

API Responses

When your app fetches data from a server, the response almost always comes as JSON. Whether you use REST or GraphQL -- the data is JSON.

Configuration Files

package.json, tsconfig.json, firebase.json -- countless tools use JSON for their configuration. You edit JSON files daily, perhaps without even consciously noticing.

Databases

NoSQL databases like MongoDB or Firestore store data as JSON-like documents. You write JSON in and get JSON out.

Code Example: Parsing JSON

In JavaScript

// JSON string to JavaScript object
const jsonString = '{"name": "Max", "age": 28}';
const user = JSON.parse(jsonString);
console.log(user.name); // "Max"

// JavaScript object to JSON string
const data = { language: "Dart", level: "advanced" };
const json = JSON.stringify(data, null, 2);
console.log(json);
// {
//   "language": "Dart",
//   "level": "advanced"
// }

JSON.parse() turns a JSON string into a JavaScript object. JSON.stringify() does the opposite. The third parameter (2) adds pretty indentation.

In Dart (Flutter)

import 'dart:convert';

// JSON string to Dart Map
final jsonString = '{"name": "Max", "age": 28}';
final Map<String, dynamic> user = jsonDecode(jsonString);
print(user['name']); // "Max"

// Dart Map to JSON string
final data = {'language': 'Dart', 'level': 'advanced'};
final json = jsonEncode(data);
print(json);
// {"language":"Dart","level":"advanced"}

// With pretty formatting
final encoder = JsonEncoder.withIndent('  ');
print(encoder.convert(data));

In Dart, you use jsonDecode() and jsonEncode() from the dart:convert package. In real Flutter projects, you typically work with model classes and libraries like json_serializable or freezed that auto-generate the mapping.

JSON vs XML: The Comparison

Before JSON came along, XML was the standard. Here's the direct comparison:

An example makes the difference clear. The same user profile in XML:

<user>
  <name>Max</name>
  <age>28</age>
  <developer>true</developer>
  <languages>
    <language>Dart</language>
    <language>JavaScript</language>
  </languages>
</user>

And in JSON:

{
  "name": "Max",
  "age": 28,
  "developer": true,
  "languages": ["Dart", "JavaScript"]
}

JSON is shorter, more readable, and easier to parse. For new projects, there's hardly a reason to choose XML anymore -- unless you're working with legacy systems or need advanced schema validation.

Common Mistakes (and How to Avoid Them)

I see these mistakes constantly, especially from beginners:

1. Trailing Commas

{
  "name": "Max",
  "age": 28,  // ERROR: Comma after the last value
}

In JavaScript, a trailing comma is allowed. In JSON, it's not. The last element must not have a comma.

2. Single Quotes

{
  'name': 'Max'  // ERROR: Single quotes
}

JSON only allows double quotes. No single quotes, no backticks.

3. Comments

{
  "name": "Max",  // This is a comment -- ERROR
  "age": 28
}

JSON does not support comments. Not with //, not with /* */. If you need comments, use a format like JSONC (JSON with Comments) or YAML.

4. Unquoted Keys

{
  name: "Max"  // ERROR: Key without quotes
}

Keys must always be strings in double quotes.

Tip: Use a JSON validator like jsonlint.com to check your JSON. Or let your editor do the work -- VS Code highlights JSON errors immediately.

Conclusion

JSON is one of the simplest and most useful concepts in software development. Six data types, a straightforward syntax, universal support. If you understand JSON, you understand how data flows in the modern web.

And the best part: you don't need to memorize it. After a few days working with APIs and configuration files, you'll read and write JSON in your sleep. You'll see it everywhere -- in API calls, in REST or GraphQL responses, in config files.

Just get started. Open a package.json in your next project and take a look. You'll be surprised how much you already understand.

Frequently Asked Questions