User-Management-App

🌐 GitHub Repo

https://github.com/Prakashsaw/User-Management-App

🚀 Live Demo

https://user-crud-app-prakash.netlify.app

📌 Description

The User Management System is a web-based application designed to help a owner to efficiently track and manage their users/employees.

🔹 Key Functionalities:

• User Authentication: Secure login & registration with email verification through OTP.
• Password Security: Bcrypt encryption for passwords and JWT token-based authentication.
• User Auth: Implemented auth middleware for secure user auth and for protected routes.
• Password Recovery: Forgot password functionality with email-based reset link.
• User Management: Add, edit, delete, and categorize users with filtering options and search functionality.

---

🛠 Tech Stack

Frontend:

• React.js, Bootstrap, CSS

Backend:

• Node.js, Express.js, Nodemailer

Database:

• MongoDB

---

⚙️ Run Locally

Step 1: Clone the project

git clone https://github.com/Prakashsaw/User-Management-App.git

Step 2: Navigate to the project directory

cd User-Management-App

Step 3: Install dependencies

Install dependencies for the frontend

cd client/
npm install

Install dependencies for the backend

cd server/
npm install

Step 4: Set up environment variables

Create a .env file inside the server/ directory and add the following:

MONGO_URL = 
PORT = 
JWT_SECRETE_KEY = 
EMAIL_HOST = 
EMAIL_PORT = 
EMAIL_USER = 
EMAIL_PASS = 
EMAIL_FROM = 
CLOUDINARY_CLOUD_NAME = 
CLOUDINARY_API_KEY = 
CLOUDINARY_API_SECRET = 

Step 5: Start the application

Start the frontend

// Open a new terminal
cd client
npm run start

Start the backend

// Open a new terminal
cd server
npm run start

Step 6: Access the app

Once the setup is complete, the app will be running on your local system.

---

🔥 Features

• 🔒 Multiple User Login/# options: # with Google, LinkedIn, Facebook and GitHub.
• 🔒 Secure User Authentication: Register, login, and logout securely.
• 📧 Email Verification: Verify accounts via a confirmation OTP sent to the email and through OTP verification.
• 🔑 Password Management: Forgot password functionality with email reset link.
• 🔑 Protected Routes: Secure protected routes through middleware implementation.
• 💰 User Management:
  • Add, edit, and delete users with confirmation prompts.

---

📸 Screenshots

Authentication & User Management

Feature	Screenshot
Homepage
Multiple Option for #
Multiple Option for #
# with Email
Verify Email Account With OTP
Login With Email
User Management Home Page
Add New User
Update User
Updated User
Forgot Password
Forgot Password

---

🛠 Made By

• @Prakashsaw

---

📝 License

This project is licensed under the MIT License.
You are free to use, modify, and distribute this software as long as you include the original license.

---

🌟 If you like this project, don't forget to star the repo! ⭐