MERN Authentication System

📸 Project Screenshot

🔗 Live Link

📈 System Overview

A full-stack authentication system built with the MERN stack (MongoDB, Express.js, React.js, Node.js) featuring email verification and password reset functionality.

🚀 Features

• 🪪 User Registration & Login
• ✉️ Email Verification System
• 🔑 Password Reset Functionality
• 🔒 Protected Routes
• 🛡️ JWT Authentication
• 🎨 Modern UI with Tailwind CSS
• 🚀 Responsive Design
• 🍪 Cookie-based Authentication
• 🔔 Toast Notification
• ⚡ Fast and Lightweight

🛠️ Technologies Used

• Frontend:

  • React.js with Vite
  • Tailwind CSS
  • Axios
  • React Router DOM
  • React Toastify

• Backend:

  • Node.js
  • Express.js
  • MongoDB with Mongoose
  • JWT for authentication
  • Nodemailer for email services
  • bcrypt for password hashing

</> API Endpoints

• Auth Routes:

  • POST /api/auth/register - Register a new user
  • POST /api/auth/login - Login user
  • POST /api/auth/logout - Logout user
  • POST /api/auth/verify-account - Verify email account
  • POST /api/auth/send-verify-otp - Send verification OTP
  • POST /api/auth/send-reset-otp - Send password reset OTP
  • POST /api/auth/reset-password - Reset password
  • GET /api/auth/is-auth - Authenticate user

• User Routes:

  • GET /api/users/get-user - Get user profile

🧩 Project Structure

mern-auth/
├── client/               # Frontend React application
│   ├── src/
│   │   ├── assets/      # Static assets
│   │   ├── components/  # Reusable components
│   │   ├── context/     # Context providers
│   │   └── pages/       # Page components
│   └── ...
└── server/              # Backend Node.js/Express application
    ├── config/         # Configuration files
    ├── controllers/    # Request handlers
    ├── middleware/     # Custom middleware
    ├── models/        # Database models
    ├── routes/        # API routes
    └── ...

Prerequisites

• Node.js (v14 or higher)
• MongoDB
• npm or yarn

Installation

1. Clone the repository:

   git clone https://github.com/Limon00001/mern-auth.git
   cd mern-auth

2. Set up the backend:

   cd server
   npm install

   Create a .env file in the server directory:

   PORT=<your-port>
   MONGODB_URI=<your-mongodb-uri>
   JWT_SECRET=<your-jwt-secret>
   SMTP_HOST=<smtp-host>
   SMTP_PORT=<smtp-port>
   SMTP_USER=<smtp-username>
   SMTP_PASS=<smtp-password>

3. Set up the frontend:

   cd ../client
   npm install

   Create a .env file in the client directory:

   VITE_BACKEND_URI=<backend-url>

4. Run the application:

   In the server directory:

   npm run dev

   In the client directory:

   npm run dev

👨‍💻 Author