DEV Community

Cover image for JSON for Beginners: What It Is and Why Developers Use It
Henry of Oracus 🇳🇬
Henry of Oracus 🇳🇬

Posted on • Originally published at henryezeanyim.hashnode.dev

JSON for Beginners: What It Is and Why Developers Use It

JSON for Beginners: What It Is and Why Developers Use It

Cover image for JSON for Beginners

If you are learning web development, you will see JSON everywhere.

APIs return it. Frontend apps send it. Backend tutorials mention it like everybody was born knowing what it means.

They were not.

JSON is one of those things that sounds technical at first, but the core idea is very simple.

JSON is just a text format for organizing data in a way that humans and computers can both read.

That is the big idea.

In this post, we will break it down in plain English, look at a small example, and explain why developers use it so often.

What does JSON stand for?

JSON stands for JavaScript Object Notation.

That name makes it sound like JSON only matters in JavaScript.
It does not.

Today, JSON is used by many languages and tools, including:

  • JavaScript
  • PHP
  • Python
  • Laravel
  • Node.js
  • mobile apps
  • third-party APIs

So even though the name comes from JavaScript, JSON is now a general-purpose data format.

What problem does JSON solve?

Programs often need to exchange information.

For example:

  • a frontend app asks a backend for user data
  • a mobile app sends login details to an API
  • one service sends order information to another service

For that exchange to work well, both sides need the data in a structure they can understand.

That is where JSON helps.

It gives data a clear shape.

Instead of sending a messy string like this:

name=Henry, age=27, isStudent=false
Enter fullscreen mode Exit fullscreen mode

You can send something structured like this:

{
  "name": "Henry",
  "age": 27,
  "isStudent": false
}
Enter fullscreen mode Exit fullscreen mode

That second version is easier to read, easier to parse, and easier to trust.

What does JSON look like?

JSON is built from two common ideas:

  • objects → data grouped with named keys
  • arrays → lists of values

Here is a simple JSON object:

{
  "name": "Ada",
  "role": "Backend Developer",
  "learning": "APIs"
}
Enter fullscreen mode Exit fullscreen mode

And here is JSON with an array inside it:

{
  "name": "Ada",
  "skills": ["PHP", "Laravel", "MySQL"]
}
Enter fullscreen mode Exit fullscreen mode

You can think of it like labeled boxes.
Each key gives a name to the value beside it.

Common JSON value types include:

  • strings → "hello"
  • numbers → 42
  • booleans → true or false
  • arrays → [1, 2, 3]
  • objects → { "key": "value" }
  • null

A very beginner-friendly example

Imagine you have a small app that displays a user profile.
The server might send back data like this:

{
  "id": 7,
  "name": "Henry",
  "email": "henry@example.com",
  "isAdmin": false
}
Enter fullscreen mode Exit fullscreen mode

Your app can now read those keys and show them on the page.

  • name can be displayed in the profile header
  • email can be shown under contact details
  • isAdmin can control whether admin buttons appear

Diagram showing an app receiving JSON from a server

That is why JSON matters in real projects.
It gives your app data in a predictable format.

Why do developers use JSON so much?

A few reasons:

1. It is readable

Even beginners can usually look at JSON and make a decent guess about what it means.

2. It is lightweight

JSON is plain text, so it is easy to send over the web.

3. Most languages support it

You do not need to invent your own format.
Most modern languages already know how to create and read JSON.

4. It works well with APIs

A huge number of APIs send responses in JSON, so learning it early pays off fast.

JSON vs JavaScript object: are they the same thing?

Not exactly.
They look similar, which is why beginners mix them up.

A JavaScript object might look like this:

const user = {
  name: "Henry",
  age: 27,
};
Enter fullscreen mode Exit fullscreen mode

JSON looks like this:

{
  "name": "Henry",
  "age": 27
}
Enter fullscreen mode Exit fullscreen mode

Important differences:

  • JSON keys use double quotes
  • JSON is data, not executable code
  • JSON does not allow things like functions or trailing commas

So JSON is similar to a JavaScript object, but it is not the same thing.

Where you will meet JSON in real life

If you keep learning backend or frontend development, you will probably see JSON in places like these:

  • API responses
  • request bodies
  • configuration files
  • database exports
  • webhooks
  • frontend state passed around between services

In Laravel, for example, returning JSON from a route can be as simple as this:

Route::get('/api/profile', function () {
    return response()->json([
        'name' => 'Henry',
        'role' => 'Developer',
        'learning' => 'JSON'
    ]);
});
Enter fullscreen mode Exit fullscreen mode

That route sends data back as JSON.

Beginner mistakes to avoid

A few common ones:

1. Forgetting double quotes around keys

This is valid JSON:

{ "name": "Henry" }
Enter fullscreen mode Exit fullscreen mode

This is not valid JSON:

{ name: "Henry" }
Enter fullscreen mode Exit fullscreen mode

2. Using single quotes

JSON uses double quotes for strings.
Single quotes are a common beginner mistake.

3. Adding trailing commas

This is invalid JSON:

{
  "name": "Henry",
}
Enter fullscreen mode Exit fullscreen mode

That last comma can break parsing.

4. Treating JSON like a programming language

JSON only describes data.
It does not run logic.
It is a format, not a full language.

Final takeaway

If you remember only one thing, remember this:

JSON is a text-based format for organizing and exchanging data.

That is why developers use it so often.

It is simple, readable, and incredibly useful once you start working with APIs and modern web apps.

And honestly, once JSON stops looking scary, a lot of beginner backend tutorials start making much more sense.

Top comments (0)