Task Management App 📝

A simple and efficient Task Management application built using the MERN stack (MongoDB, Express, React, Node.js) with authentication and task CRUD operations.

🚀 Features

• User authentication (Login/Register)
• Create, update, and delete tasks
• Mark tasks as completed or incomplete
• Pagination (10 tasks per page)
• Toast notifications for user interactions
• Mobile-friendly UI

🖼️ Screenshots

• Task List View
  

• Task Creation Modal
  

• Authentication Pages

  Signup page	Login page

🖥️ Tech Stack

Frontend:

• React.js with TypeScript
• TailwindCSS for styling
• Axios for API requests
• React Toastify for notifications

Backend:

• Node.js with Express.js
• MongoDB with Mongoose
• JSON Web Token (JWT) for authentication
• bcrypt.js for password hashing

📂 Project Structure

Frontend:

└── src/
├── App.css
├── App.tsx
├── index.css
├── main.tsx
├── assets/
├── components/
│ ├── Modal.tsx
│ └── Navbar.tsx
├── pages/
│ ├── Login.tsx
│ ├── Signup.tsx
│ ├── TaskForm.tsx
│ ├── TaskList.tsx
│ └── Tasks.tsx
├── routes/
│ ├── ProtectedRoute.tsx
│ └── routes.tsx
└── services/
└── apis.ts

Backend:

└── src/
├── index.js
├── config/
│ └── database.js
├── middlewares/
│ └── authentication.js
├── models/
│ ├── task.model.js
│ └── user.model.js
└── routes/
├── task.routes.js
└── user.routes.js

🔧 Installation & Setup

1. Clone the repository: