MODULE 2 · 260 XP
Auth & Tokens
Authentication is how your app knows who's talking to it. JWTs (JSON Web Tokens) are the standard. Let's crack one open.
JWT Anatomy
A JWT has three parts, separated by dots. Click each part to decode it.
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwiZW1haWwiOiJidWlsZGVyQGV4YW1wbGUuY29tIiwicm9sZSI6ImF1dGhlbnRpY2F0ZWQiLCJpYXQiOjE3MTExNTIwMDAsImV4cCI6MTcxMTE1NTYwMH0.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c
Header (Algorithm + Type)
{
"alg": "HS256", // signing algorithm
"typ": "JWT" // token type
}
"alg": "HS256", // signing algorithm
"typ": "JWT" // token type
}
Payload (Claims — Your Data)
{
"sub": "1234567890", // subject (user ID)
"email": "builder@example.com", // custom claim
"role": "authenticated", // Supabase role
"iat": 1711152000, // issued at
"exp": 1711155600 // expires (1 hour)
}
"sub": "1234567890", // subject (user ID)
"email": "builder@example.com", // custom claim
"role": "authenticated", // Supabase role
"iat": 1711152000, // issued at
"exp": 1711155600 // expires (1 hour)
}
Signature (Verification)
HMACSHA256(
base64UrlEncode(header) + "." +
base64UrlEncode(payload),
secret // your JWT secret
)
base64UrlEncode(header) + "." +
base64UrlEncode(payload),
secret // your JWT secret
)
The server uses this to verify the token wasn't tampered with. If anyone changes the payload, the signature won't match.
Live JWT Decoder
Paste any JWT below to decode it instantly. Try it with tokens from your Supabase project.
This lesson is for Pro members
Unlock all 300+ lessons across 30 courses with Academy Pro. Founding members get 90% off — forever.
Already a member? Sign in to access your lessons.