TaskFlow — Team Collaboration Web Application

A full-stack project management and team collaboration platform built with Node.js, Express, PostgreSQL, React, and Socket.IO.

---

Features (20 Total)

#	Feature	Description
1	User Accounts & Profiles	Phone-based registration, profile updates, timezone, bio
2	OTP Authentication	SMS OTP via Africa's Talking, JWT access + refresh tokens
3	Workspaces	Multi-tenant workspaces with owner/admin/member/guest roles
4	Projects	Projects inside workspaces, color-coded, with date ranges
5	Tasks	Full CRUD, status board, priority, assignment, subtasks
6	Labels / Tags	Color-coded labels per project, multi-label tasks
7	Comments	Threaded comments on tasks with edit/delete
8	File Attachments	Upload files to tasks (PDF, images, Word, ZIP, max 10MB)
9	Activity Log	Full history of every action per project and workspace
10	Notifications	In-app notifications for assignments, comments, mentions
11	Direct Messages	Real-time DMs between workspace members via Socket.IO
12	@Mentions	Mention teammates in comments, auto-notify them
13	Time Tracking	Start/stop timer per task, manual entry, summary by project
14	Task Dependencies	Mark tasks as blocking or blocked by other tasks
15	Milestones	Group tasks into milestones with due dates and progress tracking
16	Workspace Invitations	Invite via phone/email, token-based accept flow
17	Emoji Reactions	React to comments and messages with emojis
18	Saved Filters	Save and reuse task filter combinations
19	Recurring Tasks	Schedule daily/weekly/monthly auto-created tasks
20	Audit Trail	Admin-only log of all workspace actions with IP and timestamp

---

Tech Stack

Backend: Node.js 20 · Express 4 · PostgreSQL 15 · Socket.IO 4 · JWT · bcryptjs · Multer · Africa's Talking

Frontend: React 18 · Vite · React Router 6 · Axios · Socket.IO Client · Zustand

---

Project Structure

taskflow/
├── backend/
│   ├── src/
│   │   ├── server.js              # Entry point, Express + Socket.IO setup
│   │   ├── db/
│   │   │   ├── index.js           # PostgreSQL connection pool
│   │   │   └── migrations.sql     # Complete database schema
│   │   ├── routes/
│   │   │   ├── auth.js            # Features 1 & 2
│   │   │   ├── workspaces.js      # Feature 3
│   │   │   ├── projects.js        # Feature 4
│   │   │   ├── tasks.js           # Feature 5
│   │   │   ├── labels.js          # Feature 6
│   │   │   ├── comments.js        # Features 7 & 17
│   │   │   ├── attachments.js     # Feature 8
│   │   │   ├── activity.js        # Feature 9
│   │   │   ├── notifications.js   # Feature 10
│   │   │   ├── messages.js        # Features 11 & 17
│   │   │   ├── time.js            # Feature 13
│   │   │   ├── dependencies.js    # Feature 14
│   │   │   ├── milestones.js      # Feature 15
│   │   │   ├── invitations.js     # Feature 16
│   │   │   ├── filters.js         # Feature 18
│   │   │   ├── recurring.js       # Feature 19
│   │   │   └── audit.js           # Feature 20
│   │   ├── controllers/
│   │   │   ├── authController.js
│   │   │   ├── workspaceController.js
│   │   │   ├── projectController.js
│   │   │   ├── taskController.js
│   │   │   ├── commentController.js
│   │   │   └── messageController.js
│   │   ├── middleware/
│   │   │   ├── authenticate.js    # JWT verification
│   │   │   └── membership.js      # Workspace/project membership checks
│   │   └── utils/
│   │       ├── AppError.js        # Custom error class
│   │       ├── logger.js          # Winston logger
│   │       ├── activityLog.js     # Activity log helper
│   │       └── notify.js          # Notification helper
│   └── package.json
└── frontend/
    ├── src/
    │   ├── App.jsx                # Routes
    │   ├── context/
    │   │   └── AuthContext.jsx    # Auth state + hooks
    │   ├── services/
    │   │   └── api.js             # All API calls (Axios)
    │   └── pages/
    │       ├── LoginPage.jsx
    │       ├── DashboardPage.jsx
    │       ├── WorkspacePage.jsx
    │       ├── ProjectPage.jsx
    │       ├── TaskDetailPage.jsx
    │       ├── MessagesPage.jsx
    │       └── AllPages.jsx       # Notifications, Activity, Profile, Invite, Audit
    └── package.json

---

Quick Start

Prerequisites

• Node.js 18+
• PostgreSQL 14+
• Africa's Talking account (free sandbox for dev)

1. Clone and install

git clone https://github.com/yourusername/taskflow.git
cd taskflow/backend && npm install
cd ../frontend && npm install

2. Set up database

createdb taskflow_dev
psql -d taskflow_dev -f backend/src/db/migrations.sql

3. Configure environment

cp backend/.env.example backend/.env
# Edit backend/.env with your DB credentials and JWT secrets

4. Start development servers

# Terminal 1 — backend
cd backend && npm run dev

# Terminal 2 — frontend
cd frontend && npm run dev

Open http://localhost:5173

---

API Reference Summary

All endpoints are prefixed /api/. All protected routes require Authorization: Bearer <token>.

Method	Path	Description
POST	/auth/request-otp	Request OTP
POST	/auth/verify-otp	Verify OTP → get JWT
GET	/workspaces	List my workspaces
POST	/workspaces	Create workspace
GET	/projects/workspace/:id	List projects in workspace
GET	/tasks/project/:id	List tasks (filterable)
POST	/tasks/project/:id	Create task
PATCH	/tasks/:id/status	Update task status
GET	/comments/task/:id	Get task comments
POST	/comments/task/:id	Add comment
GET	/notifications	Get my notifications
GET	/messages/workspace/:id/conversations	List DM conversations
POST	/time/task/:id/start	Start time tracker
POST	/time/task/:id/stop	Stop time tracker
GET	/audit/workspace/:id	Audit trail (admin only)

---

30-Day Build Plan

Week	Features to implement
Week 1	Auth (1,2), Workspaces (3), Projects (4), Tasks (5)
Week 2	Labels (6), Comments (7), Attachments (8), Activity (9), Notifications (10)
Week 3	Messages (11), Mentions (12), Time Tracking (13), Dependencies (14)
Week 4	Milestones (15), Invitations (16), Reactions (17), Filters (18), Recurring (19), Audit (20)

---

License

MIT — Andrew Elkanah, Kisii University