Zum Inhalt springen

JWT, Tokens, and an Express App — My Fullstack Girly Era Unlocked (Part 01) 💅🏻🛠️

aka backend chaos, Postman errors, and drawing tokens with pens 😭✍️

Yess guys, I’m back with another weekly update (or a chaotic blog, same thing at this point).

This week was all about Express.js, learning backend basics and unlocking new dev girl powers💪🫠.

From setting up servers, hitting Postman with 403s, figuring out tokens, to finally meeting JWTs —
it was FULL vibes and full chaos.🥹🫶

So let’s dive into building a basic Express app for authentication (and yeah, some hand-drawn madness included to explain my logic 😭).and googling google 🌸

🏁 Setting Up: Express Auth App Begins
Let’s initialise an Express app — super simple.

npm init -y                 # Step 1: Start Node project
touch index.js              # Step 2: Create entry file
npm install express         # Step 3: Add Express

Open it all in VS Code. IYKYK. 👩🏻‍💻

🔐 Basic Auth — Signup & Signin
Let’s keep it minimal (but working):

✅ POST /signup → save user info
✅ POST /signin → validate + send token
✅ Use express.json() middleware
✅ Store users in an in-memory array (no DB rn, just memory lane 🧠)

And here’s what my logic sketch looked like:

Also here’s how I planned storing tokens and user info 👇
(I added JWT later, ignore that for now 😅)

🎯/me Endpoint — Authenticated Route
So I created an endpoint called /me that returns user details only if they send a valid token.

Because we love some privacy 😌

📫 Hitting It with Postman

  • GET for reading
  • POST for registering or logging in
  • Use http://localhost:3000/me to hit that private route

How I ran it:

node index.js

Now Postman just waits for your requests like:

🔓 Signup Flow
Start with /signup
(yes I made spelling errors at first… dev things 🙃)

Then hit /signin to receive your token 🎟️

🔑 Use the Token in Headers
After you receive the token, you gotta copy it and paste it in the headers when hitting /me.

⚠️ The token changes every time — it’s randomly generated by generateToken() in this version.

🧠 Auth in Action
Now when I hit /me using the valid token — boom, it works!
Returns only my data 🔥

And yeah, GET method it is 👇

Here’s what I get in my terminal too — actual user info 🔥

Now unless someone steals my token (pls don’t 😭),
they can’t access my /me endpoint.

🤔 Problem — But This Isn’t JWT Yet!

This whole setup uses a random token saved in memory.
That means every time we validate, we must query the users array.

Big no-no for real apps 😶‍🌫️

🧃 Solution — Enter JWT (JSON Web Tokens)
JWT lets us sign and verify tokens — no need to store anything server-side.
It carries its own data and verifies itself 🔐

Here’s how I understood it (and drew it out 😅): –

Some more doodles to make it clear 🖊️ ( I drew that🥹)

🔁 Replacing Token Logic with JWT

Step 1: Install JWT

npm install jsonwebtoken

Step 2: Remove generateToken()
We don’t need it anymore.

Step 3: Create a secret key

const JWT_SECRET = "USER_APP";

Step 4: Sign JWT
When the user logs in, generate a JWT token like this:

const token = jwt.sign({ username: user.username }, JWT_SECRET);

🧾 Bonus Sketch: Encryption vs Decryption
I found this while figuring out how encryption works in JWT.
Hope it helps someone 😅👇

🔐 JWT Verification: The /me Endpoint
Once you’ve switched to JWTs, it’s time to verify them when users hit your protected route.

Here’s how I did it in the /meendpoint using jwt.verify()👇

🌻Running the Final Flow (With JWT Now!)
Now let’s see it in action from start to finish, this time with JWT-powered logic.

📝 Step 1: Sign Up

🔐 Step 2: Sign In (Get Your JWT Token)
it’s long, has 3 parts separated by dots (.), and carries your data securely : –

🧠 Step 3: Authenticated /me Route
Boom 💥 — you’re in!

This time it works without needing to check the DB — JWT handles the identity 🎟️.

And here’s how the terminal looks when all things align perfectly ✨

🌸 Wrapping Up (for now…)
This was one wild ride through backend basics, but here’s what we nailed:

✅ Created a Node + Express app
✅ Built basic auth logic with random tokens
✅ Upgraded to secure JWT-based authentication
✅ Tested it all via Postman
✅ Cried once, debugged twice, and learned a LOT 😵‍💫🛠️

🌸 MY github Repo : – [https://github.com/khushikumari239/Express-APP.git]

🚨 What’s Next?
This was Part 01 of my backend chaos — stay tuned for:

🖼️ Frontend integration
🌿 Real-time form handling
🍃 And starting MongoDB (finally unlocking the M in MERN 😭)

Let me know if you vibed with this post (or if Postman scarred you too).
Until then — more bugs, more doodles, and more dev girly energy 💅✨

With 💻 & ☀️,
Khushiii❤️

raw and real. just me to you 🌼

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert