Task Manager

A full-stack Task Manager application built using the MERN stack that allows users to manage tasks across different stages: Todo, In Progress, and Done.

Live Demo

Frontend: https://supertaskx.vercel.app

Backend: https://github.com/prasad-patil22/taskflow

GitHub Repository

[Add GitHub Repository Link]

---

Features

Authentication

• User Registration
• User Login
• JWT Authentication
• Protected Routes
• User Profile
• Update Profile
• Change Password
• Secure Password Hashing using bcrypt

Task Management

• Create Task

• View Tasks

• Update Task

• Delete Task

• Task Status Management

  • Todo
  • In Progress
  • Done

Additional Features

• User-wise task separation
• Responsive UI
• Loading States
• Error Handling
• Protected APIs

---

Tech Stack

Frontend

• React.js
• React Router DOM
• Axios
• Tailwind CSS

Backend

• Node.js
• Express.js
• MongoDB Atlas
• Mongoose

Authentication

• JSON Web Token (JWT)
• bcryptjs

Deployment

• Frontend: Vercel
• Backend: Render

---

Project Structure

Frontend

src
├── pages
│   ├── Login.jsx
│   ├── Register.jsx
│   ├── Profile.jsx
│   └── TaskControl.jsx
├── components
├── App.jsx
└── main.jsx

Backend

server
├── controllers
│   ├── UserController.js
│   └── TaskController.js
├── middleware
│   └── Auth.js
├── models
│   ├── User.js
│   └── Task.js
├── routes
│   ├── UserRouter.js
│   └── TaskRouter.js
└── server.js

---

API Endpoints

User Routes

POST /api/users/register
POST /api/users/login
GET /api/users/profile
PUT /api/users/profile
PUT /api/users/change-password

Task Routes

POST /api/tasks/create
GET /api/tasks
GET /api/tasks/:id
PUT /api/tasks/:id
DELETE /api/tasks/:id

---

Environment Variables

Create a .env file in the backend root.

PORT=8000

MONGODB_URL=YOUR_MONGODB_CONNECTION_STRING

JWT_SECRET=YOUR_SECRET_KEY

---

Installation

Clone Repository

git clone <repository-url>

Frontend Setup

cd client

npm install

npm run dev

Backend Setup

cd server

npm install

npm start

---

Assumptions

• Each user can access only their own tasks.
• Email addresses are unique.
• Task stages are limited to Todo, In Progress, and Done.
• Authentication is required for all task-related operations.

---

Technical Decisions

JWT Authentication

JWT was used because it provides a simple and scalable authentication mechanism for frontend-backend communication.

Password Security

Passwords are hashed using bcrypt before storing them in the database.

MongoDB

MongoDB was selected because it offers flexible document storage and integrates well with Node.js applications.

REST API

RESTful APIs were implemented to keep the architecture simple and maintainable.

---

AI Assistance Disclosure

AI tools were used for implementation guidance, code review, debugging assistance, and development support.

As required by the assignment guidelines, a backend implementation has been included along with frontend deployment.

---

Author

Prasad