MERN Authentication App with JWT (and TypeScript)

In this video you'll learn how to add JWT authentication to a MERN stack application. You will learn how to sign, refresh and invalidate JWT tokens, as well as implement account verification & password reset flows. The frontend is built with React, Chakra UI and React-Query. The backend is built with TypeScript, Express and MongoDB. We will use Resend to send emails.

Source Code: https://github.com/nikitapryymak/mern...

0:01 App Walkthrough
5:37 Auth Flow Diagram
Backend
7:31 Initializing the backend
14:36 API Architecture
17:50 Database connection
25:33 Error handling middleware
33:46 Register endpoint
1:25:21 Login endpoint
1:41:40 Logout endpoint
1:52:16 Refresh endpoint
2:07:57 Verify Account endpoint
2:15:12 Resend Integration
2:25:31 ForgotPassword endpoint
2:35:41 ResetPassword endpoint
2:43:53 User endpoint
2:56:05 GetSessions endpoint
3:01:17 DeleteSession endpoint
Frontend
3:07:31 Initializing the frontend
3:16:02 Login page
3:35:12 Register page
3:41:22 VerifyEmail page
3:50:35 ForgotPassword page
3:58:45 ResetPassword page
4:10:37 Adding authentication to frontend
4:24:30 Profile page
4:27:56 Sessions page
4:43:00 Refreshing tokens

Resend: https://resend.com
Cookie SameSite Attribute: https://portswigger.net/web-security/...

Support Me: https://www.buymeacoffee.com/nikitadev
Contact Me: [email protected]

Music from Uppbeat:
https://uppbeat.io/t/avbe/night-in-kyoto
License code: XENVHU3KMICGEHPW

#react #javascript #nodejs