Lesson 42/100

Tutorials MERN Stack Tutorial

JWT Access Tokens

JWT Access Tokens: free step-by-step lesson with examples, common mistakes, and interview tips — part of MERN Stack Tutorial on Toolliyo Academy.

On this page

MERN Stack Tutorial · Lesson 42 of 100

JWT Access Tokens

Setup & React ✓API Mongo AuthWire & HardenShip & Projects

API Mongo Auth · 2 — Backend · ~6 min · Authentication

What is this?

After login, the API signs a JWT with a secret and returns it. Clients send Authorization: Bearer on protected routes.

Why should you care?

MernVerse needs identity without storing server sessions for every request (stateless APIs).

See it live — copy this example

Run examples in your MernVerse client/ (Vite React) or server/ (Express) folders. Keep secrets in .env.

import jwt from 'jsonwebtoken';

const token = jwt.sign(
  { sub: user.id, role: user.role },
  process.env.JWT_SECRET,
  { expiresIn: '1h' }
);

// middleware
const payload = jwt.verify(header.slice(7), process.env.JWT_SECRET);

Run Example »

Edit the code below and click Run to see the result in Toolliyo’s live editor.

Code
Result

What happened?

  • Keep JWT_SECRET long and private.
  • Put only non-sensitive claims in the payload.
  • Verify on every protected route.

Practice next

  1. Install jsonwebtoken.
  2. Sign on login success.
  3. Verify in auth middleware.
  4. Add role to claims.
  5. Return token in JSON { token }.

Remember

Sign after auth. Bearer scheme. Short expiry + refresh later.

Login token

SPA must call /api/notes securely.

Outcome: Protected route accepts a valid JWT.

Interview prep for this lesson

Practice these questions aloud after reading—each links to a full structured answer.

Junior Detailed
Explain JavaScript in the context of MERN Stack.
Short answer: JavaScript runs single-threaded with an event loop. Closures capture lexical scope; promises/async handle I/O without blocking the UI thread. How to structure your answer (60–90 seconds) Define JavaScript i…
Mid Detailed
What are common mistakes teams make with Components when using MERN Stack?
Short answer: Interviewers want a crisp definition, a practical example from your projects, and awareness of trade-offs—not textbook dumps. How to structure your answer (60–90 seconds) Define Components in plain language…
Senior Detailed
How would you debug a production issue related to State in a MERN Stack application?
Short answer: Interviewers want a crisp definition, a practical example from your projects, and awareness of trade-offs—not textbook dumps. How to structure your answer (60–90 seconds) Define State in plain language for…
Mid Detailed
Compare two approaches to API integration—when would you choose each?
Short answer: Interviewers want a crisp definition, a practical example from your projects, and awareness of trade-offs—not textbook dumps. How to structure your answer (60–90 seconds) Define API integration in plain lan…
Junior Detailed
Describe a real-world scenario where Performance mattered in a MERN Stack project.
Short answer: Interviewers want a crisp definition, a practical example from your projects, and awareness of trade-offs—not textbook dumps. How to structure your answer (60–90 seconds) Define Performance in plain languag…
Questions on this lesson 0

Sign in to ask a question or upvote helpful answers.

No questions yet — be the first to ask!

MERN Stack Tutorial
Course syllabus

MERN Tutorial

Setup and Architecture
React Fundamentals
Express APIs
MongoDB and Mongoose
Authentication
UI Meets API
Product Features
Security and Testing
Deploy and Ops
Projects
Toolliyo Assistant
Ask about tutorials, ebooks, training, pricing, mentor services, and support. I use public site content only—not admin or internal tools.

care@toolliyo.com

Need callback? Share your details