⚡ TaskFlow — Project Management App

A full-stack MERN project management application with role-based access control (Admin/Member), featuring Kanban-style task boards, team management, and a premium dark-mode dashboard.

🌐 Live Demo

Live URL: [Paste your Railway URL here]

Demo Credentials:

• Register a new account or use the signup page

🚀 Features

Authentication

• ✅ JWT-based signup & login
• ✅ Persistent sessions with token storage
• ✅ Protected routes with auto-redirect

Project Management

• ✅ Create, edit, and delete projects
• ✅ Add/remove team members by email
• ✅ Role-based access: Admin (full control) / Member (view + update status)

Task Management

• ✅ Kanban board (To Do → In Progress → Done)
• ✅ Task creation with title, description, priority, assignee, due date
• ✅ Status updates by any project member
• ✅ Priority levels: Low / Medium / High
• ✅ Overdue task highlighting

Dashboard

• ✅ Total projects, tasks, and assignments overview
• ✅ Task status breakdown with progress bars
• ✅ Overdue task alerts
• ✅ Recent activity feed

Role-Based Access Control

Action	Admin	Member
Create/edit/delete project	✅	❌
Add/remove members	✅	❌
Create/delete tasks	✅	❌
Edit task (all fields)	✅	❌
Update task status	✅	✅
View project & tasks	✅	✅

⚙️ Tech Stack

Layer	Technology
Frontend	React 18, Vite, React Router, Axios, Lucide Icons
Backend	Node.js, Express.js
Database	MongoDB + Mongoose
Auth	JWT + bcrypt
Deployment	Railway

📦 Project Structure

├── client/          # React + Vite frontend
│   └── src/
│       ├── api/         # Axios instance
│       ├── context/     # Auth context
│       ├── components/  # Reusable UI components
│       └── pages/       # Page components
├── server/          # Express backend
│   ├── config/      # Database config
│   ├── middleware/   # Auth & RBAC middleware
│   ├── models/      # Mongoose schemas
│   └── routes/      # API routes
└── package.json     # Root orchestration

🛠️ Local Setup

Prerequisites

• Node.js 18+
• MongoDB (local or Atlas)

Installation

# Clone the repo
git clone <your-repo-url>
cd taskflow

# Install all dependencies
npm run install:all

# Configure environment
cp server/.env.example server/.env
# Edit server/.env with your MONGO_URI and JWT_SECRET

# Run in development
npm run dev

The app will be available at http://localhost:5173

Environment Variables

Variable	Description
MONGO_URI	MongoDB connection string
JWT_SECRET	Secret key for JWT tokens
NODE_ENV	development or production
PORT	Server port (default: 5000)

🚀 Railway Deployment

1. Push code to GitHub
2. Create a new project on Railway
3. Deploy from GitHub repo
4. Add MongoDB plugin (or set MONGO_URI for Atlas)
5. Set environment variables: MONGO_URI, JWT_SECRET, NODE_ENV=production
6. Railway auto-detects Node.js and uses root package.json (uses railway.json if present)
7. Generate public domain from Settings
8. Open the deployed site and confirm login + API works

Notes (important)

• No VITE_API_URL needed in production: frontend calls same-origin /api when deployed (Express serves the built React app + API).

📡 API Endpoints

Auth

• POST /api/auth/register — Create account
• POST /api/auth/login — Login
• GET /api/auth/me — Get current user

Projects

• GET /api/projects — List user's projects
• POST /api/projects — Create project
• GET /api/projects/:id — Get project details + tasks
• PUT /api/projects/:id — Update project (Admin)
• DELETE /api/projects/:id — Delete project (Admin)
• POST /api/projects/:id/members — Add member (Admin)
• DELETE /api/projects/:id/members/:userId — Remove member (Admin)

Tasks

• POST /api/tasks — Create task (Admin)
• PUT /api/tasks/:taskId — Update task
• DELETE /api/tasks/:taskId — Delete task (Admin)

Dashboard

• GET /api/dashboard — Get aggregated stats

📄 License

MIT