Technologies: MERN Stack (Next.js is a bonus) or React Natvie application

Objective:

Build a “Task Manager” application to demonstrate API development, database design, frontend optimizations, state management, and clean coding skills.

Task Requirements:

1. User Authentication:

   • Implement JWT-based login and signup.
   • Protect API routes using JWT.

2. Task Management:

   • Create, update, delete, and mark tasks as completed.
   • Attributes: Title, Description, Due Date, Priority, Completion Status, Date Created.

3. Sorting & Filtering:

   • Sort tasks by title, due date, or priority.
   • Filter by completion status or due date range.

4. State Management:

   • Manage app-wide state using React Context or Redux.

5. Database Design (MongoDB):

   • Design schemas for users and tasks with relationships.

Frontend Requirements:

• Responsive design (mobile-first).
• Debounced search to filter tasks by title.
• Form validation with user-friendly error messages.

Frontend Optimizations:

• Code splitting and lazy loading.
• Minimize re-renders using memoization.
• Efficient API handling with debouncing and throttling.

Submission:

• Upload the project to a GitHub repository.
• Include setup instructions and documentation.
• Ensure modular, clean, and maintainable code.

Bonus Features:

• Dark/light mode toggle.
• Pagination for task lists.
• Multi-filtering support.

Estimated Time: 2-3 Days

We look forward to seeing your solution!

Authentication Endpoints

1. POST /api/signup

   • Description: Create a new user account.
   • Request Body:

     {
       "email": "user@example.com",
       "password": "password123"
     }
     

   • Response:

     {
       "message": "User registered successfully"
     }
     

2. POST /api/login

   • Description: Authenticate user and return a JWT token.
   • Request Body:

     {
       "email": "user@example.com",
       "password": "password123"
     }
     

   • Response:

     {
       "token": "your-jwt-token"
     }
     

3. GET /api/me

   • Description: Retrieve details of the logged-in user using the JWT.
   • Authorization: Bearer token required.
   • Response:

     {
       "id": "user-id",
       "email": "user@example.com"
     }
     

Task Management Endpoints

1. GET /api/tasks

   • Description: Retrieve the list of tasks for the logged-in user.

   • Authorization: Bearer token required.

   • Query Params (Optional):

     • sort (e.g., “title”, “dueDate”)
     • filter (e.g., “completed”, “pending”)

   • Response:

     [
       {
         "id": "task-id",
         "title": "Buy groceries",
         "description": "Milk, eggs, and bread",
         "dueDate": "2025-02-15",
         "priority": "High",
         "completed": false
       }
     ]
     

2. POST /api/tasks

   • Description: Create a new task.
   • Request Body:

     {
       "title": "Complete project",
       "description": "Finalize the Task Manager project",
       "dueDate": "2025-02-20",
       "priority": "Medium"
     }
     

   • Response:

     {
       "message": "Task created successfully",
       "task": {
         "id": "task-id"
       }
     }
     

3. PUT /api/tasks/:id

   • Description: Update task details or mark it as completed.
   • Request Body (Example – Mark Completed):

     {
       "completed": true
     }
     

   • Response:

     {
       "message": "Task updated successfully"
     }
     

4. DELETE /api/tasks/:id

   • Description: Delete a task by its ID.
   • Response:

     {
       "message": "Task deleted successfully"
     }