TaskFlow
Team task & attendance platform
Web
Full-stack web app for daily planning, task tracking, attendance, breaks, and reporting—built for real team workflows: check-in, SOD/EOD, timesheets, and admin oversight.
Project Screenshots
Click to enlarge
Click to enlarge
Click to enlarge
Click to enlarge
Click to enlarge
About the Project
TaskFlow is a full-stack web application for teams to run their day in one place: plan and execute tasks per project, check in and out, post start-of-day (SOD) and end-of-day (EOD) updates, log breaks with live timers, and view attendance on a calendar.
Admins manage users, projects, and company holidays, and can review any employee's attendance, tasks, and leaves. Reports support weekly summaries, week-over-week comparison, and date-range export to CSV/Excel for timesheets.
- Tasks — Per-project tasks (types, status, priority, expected/actual hours, links); create/edit flows with validation when marking a task complete.
- Attendance — Check-in/out, monthly calendar (present, half-day, leave, holiday, working), live hours when checked in.
- SOD / EOD — Start/end-of-day posts with timestamps used for workday-hour calculations.
- Breaks — Start/end break with type, optional reason, planned duration; live timer; break time excluded from working hours.
- Leaves & holidays — User leave requests; company holiday calendar.
- Reports — Weekly hours, tasks, and breaks; simple analytics; export attendance and tasks by date range.
- Admin — Create users and projects, assign users to projects, manage holidays; audit any user's attendance, tasks, and leaves.
- UX — Light/dark theme, responsive Material UI, keyboard shortcut (e.g. Ctrl+K) for quick access to reports/export.
| Layer | Stack |
|-------|--------|
| Frontend | Next.js (App Router), React, TypeScript, Material UI, TanStack Query, date-fns, Axios |
| Backend | NestJS, TypeScript, JWT auth, REST APIs |
| Database | PostgreSQL, Sequelize ORM, migrations |
| Other | Role-based access (USER / ADMIN), file uploads (e.g. profile photo), Notistack toasts |
- Live app: [taskflow.tarunjawla.com](https://taskflow.tarunjawla.com/)
Admins manage users, projects, and company holidays, and can review any employee's attendance, tasks, and leaves. Reports support weekly summaries, week-over-week comparison, and date-range export to CSV/Excel for timesheets.
✨ Key features
- Tasks — Per-project tasks (types, status, priority, expected/actual hours, links); create/edit flows with validation when marking a task complete.
- Attendance — Check-in/out, monthly calendar (present, half-day, leave, holiday, working), live hours when checked in.
- SOD / EOD — Start/end-of-day posts with timestamps used for workday-hour calculations.
- Breaks — Start/end break with type, optional reason, planned duration; live timer; break time excluded from working hours.
- Leaves & holidays — User leave requests; company holiday calendar.
- Reports — Weekly hours, tasks, and breaks; simple analytics; export attendance and tasks by date range.
- Admin — Create users and projects, assign users to projects, manage holidays; audit any user's attendance, tasks, and leaves.
- UX — Light/dark theme, responsive Material UI, keyboard shortcut (e.g. Ctrl+K) for quick access to reports/export.
🛠️ Tech stack
| Layer | Stack |
|-------|--------|
| Frontend | Next.js (App Router), React, TypeScript, Material UI, TanStack Query, date-fns, Axios |
| Backend | NestJS, TypeScript, JWT auth, REST APIs |
| Database | PostgreSQL, Sequelize ORM, migrations |
| Other | Role-based access (USER / ADMIN), file uploads (e.g. profile photo), Notistack toasts |
🌐 Links
- Live app: [taskflow.tarunjawla.com](https://taskflow.tarunjawla.com/)
Tech Stack
Frontend
Next.jsReactTypeScriptMaterial UITanStack Querydate-fnsAxios
Backend
NestJSTypeScriptJWTREST APIsSequelizePostgreSQL
Key Features
Per-project tasks with types, status, priority, hours, and links
Attendance: check-in/out, monthly calendar, live working hours
SOD/EOD posts and break logging with live timers
Leaves, company holidays, and admin user/project management
Weekly reports, analytics, and CSV/Excel export by date range
Light/dark theme and responsive MUI UI (Ctrl+K shortcuts)