/Authentication-System-Springboot_React

:cyclone: AuthNest is a full-stack authentication system built with Spring Boot and React. It features secure JWT login, email verification, password reset, and session persistence. Designed for scalability and modern UX, with clean API integration and responsive UI components.

Primary LanguageJavaScript

📘 AuthNest — Full-Stack Authentication System

AuthNest is a secure, scalable authentication platform built with Spring Boot (Java) on the backend and React.js on the frontend. It supports JWT-based login, email verification, password reset, session handling, and responsive UI components — designed for modern web applications.


🚀 Features

  • 🔐 JWT Authentication — Stateless login with secure token handling
  • 📧 Email Verification — OTP-based email verification flow
  • 🔁 Password Reset — Secure OTP + new password workflow
  • 🧠 Session Persistence — Automatic login restoration via token
  • 📦 React + Axios Frontend — Responsive UI with clean UX
  • 🛡️ Spring Security Backend — Custom filters, entry points, and token validation
  • 📨 Toast Notifications — Real-time feedback for all user actions

🧱 Tech Stack

Layer Technology
Frontend React, Axios, React Router, Toastify
Backend Spring Boot, Spring Security, JWT
Database MySQL
Email Service SMTP(Brevo)

🧑‍💻 Setup Instructions

🔧 Backend (Spring Boot)

  1. Clone the repo and navigate to /backend
  2. Configure your DB and email credentials in application.properties
  3. Run the app:
    mvn spring-boot:run
    

🌐 Frontend (React)

  1. Navigate to /frontend
  2. Install dependencies:
    npm install
  3. Start the dev server:
    npm run dev
    

🚀 Front Page

image

API Endpoints

  • POST /login — Authenticate user
  • POST /register — Create new account
  • POST /send-otp — Send email verification OTP
  • POST /verify-otp — Verify email OTP
  • POST /send-reset-otp — Send password reset OTP
  • POST /reset-password — Reset password
  • GET /profile — Fetch user profile
  • GET /is-authenticated — Check login status

🖼️ Authentication Flow Screenshots

🔍 Visualizing AuthNest in Action To demonstrate the secure and responsive behavior of AuthNest, below are screenshots capturing key user flows:

  • 🔐 Login with JWT — Secure token-based authentication
  • 📧 Email Verification — OTP input and validation
  • 🔁 Password Reset — OTP + new password workflow
  • 🧠 Session Persistence — Auto-login via stored token
  • 📦 Frontend UI — Clean React interface with Toast notifications

🔐 Login with JWT

Secure token-based authentication with session persistence. image

🆕 Create Account

User registration with email input and password setup. image

📦 Account Dashboard Page

User name is visible image

🔐 Reset Password Page

Email should be entered link to account image

📧 Email Verification

OTP input screen for verifying user identity via email. image

📬 Verification Email

Email sent to registered address containing OTP code. image

🔁 Password Reset

OTP validation followed by new password input. image


👤 Author

Hrishikesh
Full-stack developer passionate about building secure, scalable, and well-documented web applications.
Specialized in Spring Boot, React, and modern authentication flows.
Connect with me on LinkedIn