Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mohammedjawwad/auth-nexus
https://github.com/mohammedjawwad/auth-nexus
authentication authorization axios bcryptjs expressjs framer-motion jwt jwt-token mailtrap mongodb-atlas mongoose nodejs otp-verification react-router reactjs vite zustand
Last synced: 7 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/mohammedjawwad/auth-nexus
- Owner: MohammedJawwad
- Created: 2024-12-06T15:44:33.000Z (2 months ago)
- Default Branch: main
- Last Pushed: 2024-12-06T16:01:34.000Z (2 months ago)
- Last Synced: 2024-12-06T16:41:59.367Z (2 months ago)
- Topics: authentication, authorization, axios, bcryptjs, expressjs, framer-motion, jwt, jwt-token, mailtrap, mongodb-atlas, mongoose, nodejs, otp-verification, react-router, reactjs, vite, zustand
- Language: JavaScript
- Homepage: https://auth-nexus.onrender.com
- Size: 0 Bytes
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🌐 Auth-Nexus 🔐
**The Ultimate Authentication Solution****Auth-Nexus** is a modern MERN stack authentication system designed with security, efficiency, and user experience in mind. From OTP-based verification to JWT-secured sessions, it has everything to ensure seamless authentication.
🚀 **[Live Demo](https://auth-nexus.onrender.com)**
---
## ✨ Key Highlights
### 🔒 Authentication
- 📧 **Signup with OTP Verification:** Ensuring secure onboarding.
- 🔑 **JWT-based Login:** Access your account securely.
- 🚪 **Logout:** Easy and secure session termination.### 📤 Email Features
- ✅ **Account Verification Emails:** Verify with just a click.
- 📬 **Welcome Email Template:** Personal touch after verification.
- 🔄 **Password Reset Link:** Forgot your password? We've got you covered.### 🔐 Security Features
- 🛡️ **Password Encryption:** Using `bcrypt` for top-notch security.
- 🔑 **Token Management:** Powered by `crypto` and `jsonwebtoken`.
- 🌍 **CORS-Enabled API:** Secure cross-origin data exchange.### 💻 Frontend Features
- 📄 **Responsive Pages:** Signup, Login, OTP Verification, Email Verification, and Forgot Password.
- 🛠️ **Protected Dashboard:** Accessible only to authenticated users.
- ⚡ **Seamless Integration:** Smooth backend communication.---
## 🖼️ Screenshots
### 🔑 Signup Page
![Signup Page](signup.png)### 📧 OTP Verification Page
![OTP Email](otppage.png)### 📧 OTP from Email
![OTP Email](otpmail.png)### 🔓 Login Page
![Login Page](login.png)### 🎉 Welcome Success Email
![Welcome Email](welcomemail.png)### 👩💻 Dashboard
![Dashboard](dashboard.png)---
## 🛠️ Tech Stack
- **Frontend:** React, TailwindCSS
- **Backend:** Node.js, Express.js
- **Database:** MongoDB
- **Email Service:** Mailtrap
- **Packages:** `bcrypt`, `cors`, `crypto`, `jsonwebtoken`---
## 🚀 Getting Started
### 1. Clone the Repository
```bash
git clone https://github.com/MohammedJawwad/Auth-Nexus.git
cd auth-nexus
```
### 2. Install Dependencies
Backend:
```bash
cd backend
npm install
```
Frontend:
```bash
cd ../frontend
npm install
```
### 3. Set Up Environment Variables
Create a .env file in the backend directory with the following:
```bash
MONGO_URI=
JWT_SECRET=
MAILTRAP_USER=
MAILTRAP_PASS=
```
### 4. Run the Application
Start the Backend:
```bash
cd backend
npm start
```
Start the Frontend:
```bash
cd ../frontend
npm start
```
### 5. Open the app in your browser: http://localhost:3000