Data Engineering7 min read7 May 2026

JSON for Non-Developers: Everything You Need to Know to Work with Webhooks

A practical guide to JSON for operators — the structure, how to read webhook payloads, and how to reference fields in Make.com and n8n without being a developer.

H

Haroon Mohamed

AI Automation & Lead Generation

Why non-developers need to understand JSON

If you use Make.com, n8n, Zapier, or any automation tool, you encounter JSON constantly:

  • Webhook payloads from Typeform, GHL, Stripe, etc.
  • API request/response bodies
  • Data passed between automation steps
  • Configuration files for some tools

You don't need to code to work with JSON. But understanding its structure makes automation 10x easier.


What JSON looks like

JSON (JavaScript Object Notation) is a text format for storing structured data. Here's an example:

{
  "name": "Jane Doe",
  "email": "jane@example.com",
  "age": 32,
  "is_active": true,
  "phone": null,
  "tags": ["hot-lead", "solar"],
  "address": {
    "street": "123 Main St",
    "city": "Denver",
    "state": "CO"
  }
}

This describes one person. Let's break down what each piece means.


The 6 data types in JSON

1. String (text)

Wrapped in double quotes: "hello", "jane@example.com", "+15551234567".

Can contain letters, numbers, spaces, punctuation. Special characters inside need escaping (\" for a quote inside a string).

2. Number

Not in quotes: 32, 99.95, -5, 1000000.

Integers and decimals are the same type in JSON.

3. Boolean

True or false, no quotes: true or false.

4. Null

Represents "nothing" or "missing value": null (no quotes).

Not the same as "null" (which is a string containing the word "null").

5. Array

A list of items in square brackets, separated by commas:

["apple", "banana", "cherry"]

Arrays can contain any types, and mix types:

[1, 2, "three", true, null]

6. Object

A collection of key-value pairs in curly braces:

{
  "key1": "value1",
  "key2": 42,
  "key3": true
}

Keys are strings. Values can be any type, including nested objects and arrays.


Reading a webhook payload

Here's a typical form submission webhook payload:

{
  "event": "form.submitted",
  "timestamp": "2026-04-24T15:30:45Z",
  "form_id": "contact_us",
  "submission": {
    "name": "Jane Doe",
    "email": "jane@example.com",
    "phone": "+15551234567",
    "message": "Interested in solar panels.",
    "business_type": "residential"
  },
  "metadata": {
    "ip_address": "73.45.89.12",
    "user_agent": "Mozilla/5.0...",
    "source_page": "/solar-quote"
  },
  "tags": ["new-lead", "solar"]
}

How to read it:

  • Top level: one object with 5 keys: event, timestamp, form_id, submission, metadata, tags
  • event → string "form.submitted"
  • timestamp → string "2026-04-24T15:30:45Z" (ISO 8601 date format)
  • form_id → string "contact_us"
  • submission → object with 5 sub-keys (name, email, phone, message, business_type)
  • metadata → object with 3 sub-keys
  • tags → array of 2 strings

Dot notation and bracket notation

To reference a specific field, you use dot notation (or bracket notation in code).

For the webhook above:

  • event → "form.submitted"
  • submission.email → "jane@example.com"
  • submission.business_type → "residential"
  • metadata.ip_address → "73.45.89.12"
  • tags → the whole array
  • tags[0] → "new-lead" (first item, zero-indexed)
  • tags[1] → "solar"

How Make.com references JSON

In Make's webhook module, incoming JSON becomes available as mappable fields. To use the email:

  • You click on the email input of the next module
  • Make shows a list of available fields: event, timestamp, submission.email, etc.
  • Click submission.email → it inserts {{1.submission.email}} (1 = the module number)

Arrays in Make:

  • If the webhook has tags: ["new-lead", "solar"], Make gives you the whole array
  • To use one item, you'd typically iterate over the array or use {{1.tags[1]}} for "new-lead"

How n8n references JSON

n8n uses similar dot notation but slightly different syntax in expressions:

{{ $json.submission.email }}
{{ $json.tags[0] }}

Or in the UI, you click the field picker and select submission.email from a list.


Nested objects — understanding depth

Some webhooks have deeply nested structures:

{
  "data": {
    "customer": {
      "profile": {
        "contact_info": {
          "primary_email": "jane@example.com"
        }
      }
    }
  }
}

To access the email: data.customer.profile.contact_info.primary_email

This is annoying but not complicated. Just trace the path from outside in.


Arrays — the iteration challenge

When a webhook has an array of items, you often need to process each one:

{
  "event": "order.created",
  "order_id": "ord_12345",
  "line_items": [
    {"product": "Solar Panel", "quantity": 2, "price": 500},
    {"product": "Inverter", "quantity": 1, "price": 1200},
    {"product": "Mounting Kit", "quantity": 1, "price": 300}
  ]
}

To process each line item:

Make.com: Use "Iterator" module. It takes the array and outputs one bundle per item. Downstream modules run for each item.

n8n: "Split Out" node or loop. Processes each item individually.

Zapier: Line Item support varies by integration.


Common JSON patterns you'll encounter

Pattern 1: Success/error envelope

Many APIs return:

{
  "success": true,
  "data": { ... },
  "error": null
}

Or on failure:

{
  "success": false,
  "data": null,
  "error": {
    "code": "VALIDATION_ERROR",
    "message": "Email is required"
  }
}

Always check success before using data.

Pattern 2: Pagination

APIs that return lists often include pagination:

{
  "total": 150,
  "page": 1,
  "per_page": 25,
  "items": [ ... ],
  "next_page_url": "https://api.example.com/contacts?page=2"
}

To get all 150, call repeatedly with different page values until you've seen all.

Pattern 3: Metadata + data

Separation of actual data from metadata:

{
  "meta": {
    "request_id": "req_abc123",
    "timestamp": 1714061445
  },
  "data": { ... }
}

Useful for debugging (log the request_id if something goes wrong).


Writing JSON yourself (for API requests)

When you POST to an API from Make/n8n/Zapier, you write JSON in the body:

{
  "email": "new.contact@example.com",
  "first_name": "John",
  "last_name": "Smith",
  "tags": ["imported", "webinar-attendee"]
}

Rules:

  • Keys in double quotes
  • Strings in double quotes
  • Numbers and booleans NOT in quotes
  • Commas between fields (but NOT after the last field)
  • Curly braces around the whole thing

Common JSON errors

Trailing comma:

{
  "email": "x@example.com",
  "name": "John",   <-- this trailing comma is invalid JSON
}

Single quotes:

{'email': 'x@example.com'}   <-- invalid, must be double quotes

Unquoted keys:

{email: "x@example.com"}   <-- invalid, keys must be in quotes

Unescaped special chars:

{"message": "She said "hi""}   <-- invalid, inner quotes need \"

Correct: {"message": "She said \"hi\""}


Tools for working with JSON

JSON validators

If you're pasting JSON into a tool and getting errors, validate the syntax:

  • jsonlint.com
  • jsonformatter.org

They'll tell you exactly which line has the problem.

JSON formatters

Raw JSON is ugly. Formatted JSON is readable:

{"name":"Jane","age":32,"tags":["a","b"]}

becomes

{
  "name": "Jane",
  "age": 32,
  "tags": ["a", "b"]
}

Same tools above will format for you. Or Ctrl+Shift+P → "Format Document" in VS Code.

Make.com's text parser

If you have a JSON string in a field and need to extract a value, use Make's "Parse JSON" module. Gives you access to fields via dot notation.

n8n's JSON node

Similar — parse JSON string into object, then reference fields.


Reading JSON without going crazy

Indent consistently. Copy the JSON into a formatter if it's on one line.

Trace paths from outside in. Start at the top, drill down.

Use a viewer. VS Code has built-in JSON syntax highlighting + collapsing. Makes navigation easier.

When stuck, log it. In Make/n8n, dump the full payload to a Google Sheet or email. See the full structure. Reference fields from there.


Sources

JSON is defined by RFC 8259 (2017), which supersedes RFC 4627 and ECMA-404. All syntax and type descriptions align with the current specification. Usage patterns documented here are standard across all major automation platforms (Make.com, n8n, Zapier), verified against their official documentation.

Need help parsing a specific webhook payload or writing an API request body? Let's talk — this is often a 30-minute fix if you know what to look for.

Need This Built?

Ready to implement this for your business?

Everything in this article reflects real systems I've built and operated. Let's talk about yours.

H

Haroon Mohamed

Full-stack automation, AI, and lead generation specialist. 2+ years running 13+ concurrent client campaigns using GoHighLevel, multiple AI voice providers, Zapier, APIs, and custom data pipelines. Founder of HMX Zone.

ShareShare on X →