Skip to content

Zohaibarif69/Team-Task-Manager

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

37 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Team Task Manager

A full-stack web application for teams to collaborate on tasks, manage team members, and organize work efficiently. Built with React, Node.js, Express, and PostgreSQL.


Features

Core Features

  • Secure Authentication - Register/Login with password hashing (bcrypt) and session management

  • Team Management - Create, edit, delete teams and manage team members

  • Task Management - Full CRUD operations for tasks with assignment and filtering

  • Member Management - Add/remove team members with role-based access

  • Task Filtering - Filter tasks by team, assignee, or status

  • User Profiles - View and edit user profile information

  • Responsive UI - Works seamlessly on desktop and mobile devices

  • Task Due Date Reminders - Automatic daily reminders for tasks (8 AM) with email notifications (using Resend API)

  • Email Invite System - Invite team members via email with time-limited tokens (48 hours)

  • Role-Based Access Control - Admin and member roles with permission management

  • Advanced Task Filtering - Filter by team, assignee, or status with search functionality


Tech Stack

Frontend

  • React 18 - UI library with hooks
  • TypeScript - Type-safe JavaScript
  • Vite - Lightning-fast build tool
  • Tailwind CSS - Utility-first CSS framework
  • Shadcn/ui - High-quality React components
  • React Router v7 - Client-side routing
  • React Hook Form - Efficient form management

Backend

  • Node.js - JavaScript runtime
  • Express.js - Minimal and flexible web framework
  • PostgreSQL - Robust relational database
  • Passport.js - Authentication middleware
  • Express Session - Session management
  • bcryptjs - Password hashing
  • express-validator - Input validation
  • node-cron - Task scheduling for reminders

DevOps & Security

  • CORS - Cross-origin resource sharing configured
  • HTTP-only Cookies - XSS protection
  • SameSite Cookies - CSRF protection
  • Parameterized Queries - SQL injection prevention
  • Environment Variables - Secure configuration management

Quick Start

Prerequisites

  • Node.js v16+ and npm (or pnpm)
  • PostgreSQL v12+ running locally or remotely
  • Git for version control

1. Clone the Repository

git clone https://github.com/Zohaibarif69/AssessmentTask.git
cd taskAssesment

2. Backend Setup

cd backend

# Install dependencies
npm install

# Create .env file with database credentials
cp .env.example .env
# Edit .env with your PostgreSQL details

# Initialize database and seed data
npm run migrate

# Start development server (with auto-reload)
npm run dev
# Or for production: npm start

The backend server will run on http://localhost:5000

3. Frontend Setup

cd frontend

# Install dependencies
npm install

# Start development server
npm run dev

# Build for production
npm run build

The frontend will run on http://localhost:5173


Security Features

Authentication & Authorization

  • Passport.js Local Strategy - Secure password-based authentication
  • Bcryptjs - Password hashing with 10 salt rounds
  • Express Session - Server-side session management in PostgreSQL
  • HTTP-only Cookies - Prevents XSS attacks from JavaScript
  • SameSite=lax Cookies - Prevents CSRF attacks
  • 24-hour Session Expiry - Automatic session timeout

Input Validation & Sanitization

  • express-validator - Validates all user inputs
  • Email format validation - RFC 5322 compliant
  • Password requirements - Minimum 6 characters
  • Parameterized Queries - Prevents SQL injection
  • Rate Limiting Ready - Can be added with express-rate-limit

Authorization Middleware

  • ensureAuthenticated - Protects all non-auth routes
  • ensureNotAuthenticated - Prevents double-login
  • ensureTeamAccess - Users can only access their teams
  • ensureTeamCreator - Only team creators can modify/delete teams

Database Security

  • Foreign Key Constraints - Maintains referential integrity
  • Cascading Deletes - Clean up related data
  • Unique Constraints - Prevents duplicate emails/team names
  • Indexes on session.expire - Efficient session cleanup

Testing & Validation

Manual Testing Checklist

Authentication

  • Register new user
  • Login with existing user
  • Logout and verify session cleared
  • Try to access protected route without login
  • Verify HTTP-only cookies set correctly

Teams

  • Create a new team
  • View team list
  • Edit team details
  • Add member to team
  • Remove member from team
  • Delete team (creator only)
  • Verify non-creators can't delete teams

Tasks

  • Create task within team
  • Assign task to team member
  • Update task status
  • Filter tasks by team
  • Filter tasks by assignee
  • Filter tasks by status
  • Delete task
  • Verify non-creators can't delete others' tasks

Reminders

  • View reminders page
  • Manually trigger reminders
  • Verify console logs for email notifications

Invites

  • Send invite to email
  • Verify token generation
  • Accept invite and become team member
  • Verify invite expires after 48 hours

Key Accomplishments

Full CRUD Operations - All entities (teams, tasks, users) fully manageable ✅ Session Persistence - Users stay logged in across page refreshes ✅ Role-Based Access - Team creators have elevated permissions ✅ Real-time Data - All components fetch fresh data from API ✅ Error Handling - Comprehensive error messages and validation ✅ Responsive Design - Works on desktop, tablet, and mobile ✅ Bonus Features - Task reminders and email invites implemented ✅ Security Best Practices - Password hashing, XSS/CSRF protection, input validation ✅ Professional Code - TypeScript, modular structure, clean commits ✅ Git Workflow - Meaningful commits and branch management


Environment Variables

Backend (.env)

# Database
DATABASE_URL=postgresql://postgres:password@localhost:5432/taskassessment

# Server
PORT=5000
NODE_ENV=development

# Session
SESSION_SECRET=dev_secret_key_12345

# Email Service (Resend - for production)
RESEND_API_KEY=your_resend_api_key
SENDER_EMAIL=noreply@yourdomain.com

Frontend (.env if needed)

VITE_API_URL=http://localhost:5000/api

Last Updated: May 28, 2026

About

A full-stack web application for teams to collaborate on tasks, manage team members, and organize work efficiently.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Contributors