What is a JWT?

JWT stands for (JSON Web Token) defines for us a way to transfer information securely between endpoints as a JSON object.

What is JSON?

JSON (JavaScript Object Notation) is a lightweight format for storing and exchanging data. It looks like regular JavaScript objects; but it’s not limited to JavaScript! Almost every programming language understands JSON.

Here’s what a small JSON file might look like:

{
  "name": "Tala",
  "age": 32,
  "isStudent": true
}

It’s just a collection of key-value pairs (like a labeled list).

Why is JSON so popular?

JSON is the most common way to send and receive data between the frontend and the backend; for a few simple reasons:

• ✅ It’s language-independent: Whether you’re using JavaScript/Vue/React on the frontend, or Go/Python/Ruby on the backend; they all know how to read and write JSON.
• ✅ It’s perfect for APIs: When a user fills a form on a website, the data can be turned into JSON and sent to the backend server to be processed, saved, or validated.

This is exactly why JWT (JSON Web Tokens) are built using JSON — they’re easy to generate, send, and decode across systems.

🔑 What is a Token?

A token is a small piece of data used to prove that someone is allowed to do something — like accessing a private page, calling an API, or staying logged in.

Think of a token like a digital access card. 🪪
When you log in to a website, the server gives you this "card" (the token). Instead of logging in again and again, you just show your token — and if it's valid, you're allowed in.

🛠️ JWT In web development:

• When a user logs in, the server checks their email/password.
• If it’s correct, the server creates a token (like a JWT) and sends it back.
• The frontend (browser/app) stores the token and uses it with future requests.
• The backend verifies the token each time before allowing access to protected routes or actions.

Tokens help keep your app stateless, secure, and scalable — and JSON Web Tokens (JWTs) are one of the most popular ways to implement them.

What is the structure of a JWT?

A JWT (JSON Web Token) is just a string made of three parts, separated by dots:

xxxxx.yyyyy.zzzzz

1️⃣ Header

The header is a small JSON object that describes the token. It usually includes:

{
  "alg": "HS256",
  "typ": "JWT"
}

• alg = which algorithm is used to sign the token (like HS256)
• typ = token type, usually "JWT"

This JSON gets encoded in Base64Url and becomes the first part of the token.

2️⃣ Payload

The payload contains the data (claims) you want to include. Usually info about the user. Example:

{
  "sub": "1234567890",
  "name": "John Doe",
  "admin": true
}

There are 3 types of claims:

• Registered: standard ones like exp (expires), iss (issuer), sub (subject)
• Public: custom but shared publicly (to avoid conflicts)
• Private: fully custom, shared between your frontend and backend

This also gets Base64Url encoded and becomes the second part of the token.

🚨 Important: The payload is not encrypted, it’s just encoded. Anyone can read it, so don’t put passwords or secret info inside.

3️⃣ Signature

This is what makes JWTs secure. To create it, we take:

• The encoded header
• The encoded payload
• A secret key
• The algorithm (like HS256)

Then we generate a signature using:

HMACSHA256(
  base64UrlEncode(header) + "." + base64UrlEncode(payload),
  secret
)

This makes sure the token hasn’t been changed. If someone tries to change it, the signature will no longer match.

⚠️ Example of Tampering

Original payload:

{ "username": "tala", "age": 22 }

The signature was created based on that.

But someone changes the payload to:

{ "user_id": "999", "password": "123456" }

Now the signature doesn’t match; the server will reject the token.
✅ This is how JWTs detect if someone has tampered with the data.

Final Result

The output is three Base64-URL strings separated by dots that can be easily passed in HTML and HTTP environments.

The following shows a JWT that has the previous header and payload encoded, and it is signed with a secret.

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOnRydWUsImlhdCI6MTUxNjIzOTAyMn0.KMUFsIDTnFmyG3nMiGM6H9FNFUROf3wh7SmqJp-QV30

Can Anyone Decode it? 😁 Write in the comments below the decoded data⬇️

HINT: Signing algorithm is HS256.

Sure! Here's a short and clear version:

🟡 When to Use JWTs

• Authorization: After login, the JWT is sent with each request to access protected routes or services. It's widely used in Single Sign-On (SSO).

• Data Sharing: JWTs can securely share info between systems. Their signature ensures the data is authentic and hasn't been changed.

• Stateless: No need to store session data on the server — all needed info is inside the token.

Validation vs. Verification in JWT💯

• Validation checks if the token is correctly built:

  • Does it have 3 parts (header, payload, signature)?
  • Is it using valid formatting (Base64)?
  • Does it include valid claims (like exp, iat, etc.)?

• Verification checks if the token is trustworthy:

  • Is the signature correct (wasn’t changed or faked)?
  • Does it come from the expected issuer?
  • Is it meant for the right audience?

In short:
🧩 Validation = Is the token well-formed and valid?
🔐 Verification = Is the token real and untampered?

Most systems do both to stay secure.