A Project Report on
“TITLE OF PROJECT”
Submitted in partial fulfillment of the
Requirement for the award of degree of the
BACHELOR OF SCIENCE (COMPUTER SCIENCE)
By
(Name of Student)
Seat No.
Under the esteemed guidance of
Ms. Aarti Wani
DEPARTMENT OF COMPUTER SCIENCE
PILLAI HOC COLLEGE OF ARTS, SCIENCE &
COMMERCE (AUTONOMOUS), RASAYANI
NAAC Accredited ‘A+’ Grade in Cycle 2
(ISO 9001:2015 Certified)
(Affiliated to Mumbai University)
Rasayani, 410207
Maharashtra
AY 2025-26
PILLAI HOC COLLEGE OF ARTS, SCIENCE & COMMERCE
(Autonomous), RASAYANI
NAAC Accredited ‘A+’ Grade in Cycle 2
(ISO 9001:2015 Certified)
(Affiliated to Mumbai University)
RASAYANI, 410207 MAHARASHTRA
DEPARTMENT OF COMPUTER SCIENCE
CERTIFICATE
This is to verify that the project entitled, “(Title of Project)”, is bonafide work
of (Name of Student) of TY B.Sc. (Sem V) bearing Seat No. (Seat No.),
submitted in partial fulfillment of the requirements for the award of degree of
BACHELOR OF SCIENCE in COMPUTER SCIENCE from the University
of Mumbai during the academic year 2025–2026.
DECLARATION
I hereby declare that project entitled, “(Title of Project)” done at Pillai HOC
College of Arts, Science and Commerce (Autonomous), Rasayani has not been
in any case duplicated to submit to any other university for the award of any
degree. To the best of my knowledge other than me, no one has submitted to any
other university.
The project is done in partial fulfilment of the requirements for the award of
the degree of BACHELOR OF SCIENCE (COMPUTER SCIENCE) to be
submitted as SEMESTER V project as part of our curriculum.
(Student’s Signature)
(Name of Student)
ACKNOWLEDGEMENT
It gives me great pleasure to present this project report on “(Collaborative Task Handling
System)”.
After the completion of this work, words are not enough to express my feelings about all those
who helped me to reach my goal; feeling above this is my indebtedness to the Almighty for
providing me this moment in life.
It’s a great pleasure and moment of immense satisfaction for me to express my profound
gratitude to my Project Guide, Ms. Aarti Wani whose constant encouragement enabled me
to work enthusiastically. Her perpetual motivation, patience and excellent expertise in
discussion during the progress of the project report work has benefited me to an extent which
is beyond expression. I am highly indebted to her invaluable guidance and ever-ready support
in the successful completion of this project report in time. Working under her guidance has
been a fruitful and unforgettable experience.
I would like to thank all the people who contributed to the successful completion of the project.
I would like to thank our Principal Dr. Rinkoo Shantnu and Department Coordinator Ms.
Priyanka Sorte for their support.
I would also like to thank the entire Computer Science department of Pillai H.O.C College of
Arts, Science and Commerce and all Library staff for their cooperation, which helped me to
complete this project report.
Thanking you,
(Moazzam Mulla)
APPROVED PROJECT PROPOSAL
PRN No: 2023016400438057 Seat No: 25CS509027
1. Name of student:
Moazzam Mulla
2. Title of the Project:
Collaborative Task Handling System
3. Name of the Guide:
Ms. Aarti Wani
4. Teaching experience of the Guide:
5. Is this your first submission?
□ Yes
□ No
Signature of the student Signature of the Guide
Date: Date:
Signature of the Co-ordinator
Date:
List of Figures
Figure Figure Name Page No.
No.
4.1 Use Case Diagram of Collaborative Task 19
Handling System
4.2 Class Diagram of Collaborative Task 20
Handling System
4.3 Sequence Diagram of Task Creation and 21
Assignment
4.4 Activity Diagram of Task Management 22
Flow
4.5 Deployment Diagram of Collaborative Task 23
Handling System
Table of Contents
Sr. No. Title Page No.
1. Introduction 9-10
2. Objectives 11-13
3. Scope 14-16
4. System Design 17-23
5. Methodology 24-26
6. Tools & Technologies 27-29
7. Result Analysis 30-35
8. Conclusion and Future Scope 36-38
9. References 39-40
Plagiarism Report
Introduction
Introduction
Efficient task management is essential for the success of any academic or
professional project. Traditional methods like emails and spreadsheets often
lead to confusion, duplication of work, and missed deadlines. To overcome
these challenges, a digital solution is required that supports teamwork,
transparency, and smooth collaboration.
The Collaborative Task Handling System (TeamTrack) is designed to provide
a simple yet effective platform for managing projects and tasks. It allows
users to sign up securely, create projects, assign roles, and manage tasks
through a Kanban board with drag-and-drop functionality. Users can also edit,
delete, and prioritize tasks, while comments help improve communication
among team members.
This system offers both light and dark themes for better user experience and
ensures responsiveness across devices. Unlike costly and complex tools such
as Jira or Asana, TeamTrack provides all essential features in a lightweight
and user-friendly manner.
With its combination of secure authentication, intuitive interface, and real-
time collaboration features, the Collaborative Task Handling System proves to
be a valuable tool for academic teams, small businesses, and professional
groups seeking to manage tasks effectively.
Objectives
Objectives
The Collaborative Task Handling System (TeamTrack) has been
developed with the following objectives in mind. These objectives
clearly outline the purpose of the system and the benefits it provides to
users in academic, business, and professional environments.
1. To provide secure authentication for user registration and login
Security is one of the most important requirements for any modern web
application. The system aims to provide a safe and secure method for
users to create accounts and log in using valid credentials. Passwords are
stored securely and user details are validated properly to prevent
unauthorized access.
2. To allow creation and management of projects for team
collaboration
In any team, projects act as the main container for tasks and
responsibilities. The system allows users to create new projects, define
project details, and add members. This ensures that all tasks are grouped
properly within their respective projects, reducing confusion and
maintaining a clear workflow.
3. To enable task operations such as add, edit, delete, and prioritize
The heart of the system is task management. Users can add new tasks
with details like title, description, and priority. They can edit tasks when
updates are needed, delete tasks that are no longer required, and
prioritize tasks to focus on what is most important. This gives users
complete flexibility in handling their work.
4. To support a Kanban board with drag-and-drop functionality
A modern task management tool should provide a visual way to
organize work. The system uses a Kanban board where tasks can be
moved between columns such as “To Do,” “In Progress,” and
“Completed.” The drag-and-drop feature makes task tracking intuitive
and helps teams see the overall progress at a glance.
5. To improve communication among team members using task
comments
Communication is essential in teamwork. Instead of using external apps
or emails, the system allows users to add comments directly to tasks.
This ensures that all discussion about a task stays connected to it,
making collaboration more effective and reducing miscommunication.
6. To ensure responsive design for both desktop and mobile users
Since users may access the system from different devices, it is important
that the application works seamlessly on desktops, laptops, tablets, and
mobile phones. The responsive design ensures that the interface adjusts
to different screen sizes, giving all users a smooth experience.
7. To offer theme customization (dark and light mode) for better user
experience
Different users have different preferences when it comes to interface
design. Some prefer light mode for readability, while others prefer dark
mode to reduce eye strain. By offering both options, the system
improves user comfort and enhances overall usability.
8. To provide a cost-effective and user-friendly alternative to existing
tools
Many existing task management platforms like Jira or Asana are
expensive or overly complex for small teams and academic projects.
TeamTrack is designed as a lightweight and affordable solution that
provides all essential features without unnecessary complexity.
9. To create a scalable system for future enhancements
The system has been designed with scalability in mind. While the
current version includes authentication, task management, collaboration,
and theming, it can be extended in the future with features such as
mobile applications, notifications, file sharing, or AI-based task
recommendations.
Scope
Scope:
The scope of the Collaborative Task Handling System (TeamTrack)
defines the boundaries of the project, its target users, and the
functionalities it provides. The system has been developed with the
intention of supporting collaboration, improving productivity, and
ensuring transparency in task management. It can be applied across
academic, business, and professional domains.
1. Academic Use
The system is highly suitable for students and faculty members working
on academic projects. Students can create project groups, assign tasks to
individual team members, and monitor progress using the Kanban board.
Comments on tasks make it easier for teams to share updates and clarify
doubts. Faculty members supervising projects can also use the platform
to track deliverables and ensure deadlines are met.
2. Small Businesses and Startups
For startups and small organizations, expensive task management
software often becomes a burden. TeamTrack provides an affordable
and lightweight alternative to platforms like Jira and Trello. Business
owners can create projects, assign tasks to employees, and track
performance in real time. The drag-and-drop interface provides a clear
visual overview of ongoing work, helping managers make quick
decisions.
3. Professional Teams and Organizations
The system can also be used in professional environments where
collaboration and accountability are key. Team members can see their
assigned tasks, update progress, and communicate through task-based
comments. The role-based access ensures that responsibilities are clearly
defined and mismanagement is avoided.
4. Accessibility and Usability
Since the system is built with a responsive design, it can be accessed
from desktops, laptops, tablets, and mobile devices without any
compatibility issues. This makes it convenient for users who may need
to work from different environments. Additionally, the dark and light
theme option improves user comfort and ensures long working hours do
not cause eye strain.
5. Scalability and Future Enhancements
The current scope of the project includes authentication, project and task
management, drag-and-drop task movement, comments, and theming.
However, the system has been designed to be scalable. In the future,
additional features such as mobile app support, email notifications,
calendar integration, and AI-driven task recommendations can be added
without changing the overall structure.
6. Limitations
While the system offers many useful features, it does not currently
support advanced integrations such as third-party plugins, file
attachments, or offline usage. These limitations have been intentionally
kept to maintain simplicity and focus on core functionality. They can,
however, be addressed in future versions of the system.
System Design
System Design:
UML Diagrams:
UML (Unified Modeling Language) diagrams are used to represent the
structure and behavior of the TeamTrack system. They provide a clear
visualization of how different modules, users, and processes interact with each
other. These diagrams serve as blueprints, helping developers and
stakeholders to understand system functionality, architecture, and data flow.
The following UML diagrams have been prepared for the TeamTrack system:
• ➤ Use Case Diagram
• ➤ Class Diagram
• ➤ Sequence Diagram
• ➤ Activity Diagram
• ➤ Deployment Diagram
These diagrams collectively explain how the system works, the interactions
between users (actors) and modules, and the internal logic that drives the
functionality.
4.1 Use Case Diagram
Purpose:
The use case diagram illustrates the major functionalities of TeamTrack,
showing how users and administrators interact with the system. It highlights
actions like creating tasks, editing tasks, assigning priorities, inviting
members, managing projects, and viewing analytics.
Components:
• Actors: User, Admin
• Use Cases: Sign Up / Login, Create/Edit/Delete Task, Assign Task,
Manage Members, Switch Theme, View Dashboard, Comment on
Tasks, View Analytics, Create Project, Invite Member.
• Relationships: Show how actors are linked to different system features.
Relevance:
This diagram provides a high-level overview of how the system supports
collaboration and productivity, making it easier to identify user requirements.
Fig 4.1 Use Case Diagram
4.2 Class Diagram
Purpose:
The class diagram explains the static structure of TeamTrack. It shows
different classes, their properties, methods, and how they relate to each other.
Components:
• Classes: User, Role, AuthService, Task, Project.
• Attributes: UserId, name, email, passwordHash, roleId, etc.
• Methods: register(), login(), logout(), createTask(), assignRole().
• Relationships: Many-to-one (User–Role), dependencies (User–
AuthService), aggregation (Project–Task).
Relevance:
This diagram helps developers understand the object-oriented structure,
making system design and coding easier.
Fig 4.2 Class Diagram
4.3 Sequence Diagram
Purpose:
The sequence diagram describes the step-by-step interaction of objects during
a task creation flow. It explains the order of messages exchanged between
user, dashboard, controller, service, and database.
Components:
• Actors: User
• Objects: Dashboard, TaskController, TaskService, Database
• Messages: sendTaskDetails(), createTask(), insertTask(), taskSaved(),
updateTaskList().
Relevance:
This diagram helps visualize real-time execution flow, ensuring smooth task
creation and tracking.
Fig 4.3 Sequence Diagram
4.4 Activity Diagram
Purpose:
The activity diagram illustrates the workflow of task management. It shows
how users interact with the system to perform actions like login, create task,
assign members, update task, and log out.
Components:
• Actions: Login → Create Task → Assign Members → Update Task →
Logout.
• Decisions: Authentication check, task validation.
• Flow: Sequential representation of user actions.
Relevance:
This diagram demonstrates the logical flow of activities, helping developers
identify dependencies and optimize the workflow.
Fig 4.4 Activity Diagram
4.5 Deployment Diagram
Purpose:
The deployment diagram shows the physical architecture of TeamTrack. It
represents how software components are deployed across hardware devices.
Components:
• Nodes: Client Machine (Browser), Application Server (Next.js +
Hono.js), Database Server (Prisma + SQLite).
• Connections: Secure API communication between frontend and
backend, database queries from server.
Relevance:
This diagram ensures clarity in how the system is hosted, deployed, and
accessed by users in a real environment.
Fig 4.5 Deployment Diagram
Methodology
Methodology:
The development of the Collaborative Task Handling System (CTHS)
follows a structured approach to ensure that the application is reliable, user-
friendly, and meets the requirements of end users. The System Development
Life Cycle (SDLC) was adopted, with each phase contributing to the
effective completion of the project.
1. Requirement Analysis
The initial phase focused on understanding the needs of end users such as
students, project teams, and administrators.
• Requirements included secure authentication, task creation and editing,
Kanban board visualization, collaboration features, role-based access,
and reporting.
• Feedback from potential users was studied to ensure the system solved
real collaboration and task management challenges.
2. System Design
In this phase, the overall architecture of the system was planned.
• The frontend was designed using Next.js, React, and Tailwind CSS to
provide a responsive and professional interface.
• The backend was structured using Hono.js with Prisma for database
handling.
• UML diagrams such as Use Case, Class, Activity, Sequence, and
Deployment were created to visualize system interactions, structure, and
workflows.
3. Implementation
The actual coding and development of the system were carried out here.
• Authentication and authorization modules were implemented to allow
secure sign-up, login, and role management.
• Features such as task creation, editing, drag-and-drop on the Kanban
board, theme switching, and member invitations were developed.
• Integration between the frontend and backend ensured smooth data flow
and real-time updates.
4. Testing
The system underwent rigorous testing to ensure correctness and usability.
• Unit testing was done for individual modules such as task creation and
authentication.
• Integration testing verified communication between frontend and
backend.
• User acceptance testing was performed to check if the application meets
the expectations of its intended users.
5. Deployment
Once tested, the system was deployed in a local development environment
and prepared for production deployment.
• Database migrations were set up using Prisma.
• The application was configured to run smoothly on a local host and is
ready to be deployed on cloud platforms for broader access.
6. Maintenance
This phase focuses on handling errors reported by users, updating features,
and improving performance.
• Future enhancements may include advanced analytics, AI-based task
suggestions, and integration with external productivity tools.
Tools & Technologies
Tools & Technologies:
The development of the Collaborative Task Handling System (CTHS)
required the use of modern tools, frameworks, and technologies that ensured
scalability, performance, and usability. The selection of these tools was
based on the project requirements, ease of integration, and long-term
maintainability.
1. Frontend Technologies
• Next.js 15: A React-based framework used for building the frontend of
the system. It provides server-side rendering and efficient routing for
better performance.
• React 19: JavaScript library for building user interfaces. It allows the
development of reusable components and provides a dynamic,
responsive UI.
• TypeScript: A superset of JavaScript that adds type safety, reducing
errors during development and making the codebase easier to maintain.
• Tailwind CSS: A utility-first CSS framework used to design a modern,
responsive, and mobile-friendly user interface.
2. Backend Technologies
• Hono.js: A lightweight and fast backend framework used for creating
APIs and handling server-side logic.
• Prisma ORM: Object Relational Mapping tool used for database
interaction. It simplifies queries, migrations, and schema management.
3. Database
• SQLite (for development): A lightweight database used during
development for quick testing.
• PostgreSQL / MySQL (for production): A robust relational database
option that ensures scalability, reliability, and secure data storage.
4. Authentication
• Custom Authentication System: Developed for secure login and
registration. It includes password hashing, token generation, and role-
based access control (Admin/User).
5. UI/UX Components
• Radix UI: Provides accessible and customizable UI components.
• Framer Motion: Used for adding smooth animations and transitions,
improving the overall user experience.
6. Development Tools
• Node.js (v18+): Runtime environment for executing JavaScript code and
managing backend services.
• npm (Node Package Manager): Used to install and manage project
dependencies.
• Git & GitHub: Version control system for managing code and enabling
collaboration.
7. Testing Tools
• Jest / Manual Testing: For testing the correctness of individual modules.
• Integration Testing Frameworks: Used to ensure smooth communication
between the frontend and backend.
8. Deployment Tools
• Localhost (Development): Initial environment for testing the project.
• Cloud Platforms (Optional): The system can be deployed on cloud
services such as Vercel, Netlify, or AWS for broader accessibility.
Result Analysis
Result Analysis
6.1 Sample Code
// Hook to handle creating a new issue
export const useCreateIssue = () => {
const queryClient = useQueryClient();
const mutation = useMutation<ResponseType, Error, RequestType>({
// API call for creating issue
mutationFn: async (json) => {
const response = await fetch('http://localhost:8000/api/issues', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'include',
body: JSON.stringify(json),
});
if (!response.ok) {
throw new Error(`Failed to create issue: ${response.status}`);
}
return await response.json();
},
onSuccess: (data) => {
toast.success("Issue created!");
queryClient.invalidateQueries({ queryKey: ["issues"] });
},
onError: (error) => {
toast.error(`Error: ${error.message}`);
},
});
return mutation;
};
// Validation rules for issue form
const editIssueFormSchema = z.object({
title: z.string().min(1, "Title is required").max(200),
description: z.string().optional(),
type: z.enum(["task", "story", "bug", "feature", "improvement"]),
priority: z.enum(["low", "medium", "high", "critical"]),
storyPoints: z.number().int().min(1).max(100).optional()
});
// What happens when the form is submitted
const onSubmit = (values) => {
updateIssue(
{ issueId: issue.id, data: values },
{
onSuccess: (data) => {
form.reset();
onOpenChange(false);
onSuccess?.(data?.issue);
}
}
);
};
6.2 Output:
Fig 6.2.1 Sign In Screen
Short Description:
This figure shows the Sign In screen of the system. Users enter their
registered email and password to securely log in and access the
application. It provides authentication and redirects the user to the
dashboard upon successful login.
Fig 6.2.2 Dashboard Screen
Short Description:
This figure displays the Dashboard with a Kanban-style task board. Tasks
are organized into stages such as To Do, In Progress, In Review, and
Done. It also highlights task attributes like type, priority, and story
points, helping users track project progress in real time.
Fig 6.2.3: Backend API Response
Short Description:
This figure shows the backend API response where project data is
stored and retrieved. It demonstrates how the system manages projects
with details such as ID, name, description, type, and timestamps. This
ensures that the frontend and backend remain synchronized for
smooth project handling.
Conclusion and Future Scope
7.1 Conclusion:
The Collaborative Task Handling System (CTHS) has been successfully
developed as a platform to simplify project and task management in a
collaborative environment. The system focuses on addressing
challenges faced in teamwork, where multiple users must coordinate,
manage responsibilities, and track progress effectively. With features
such as secure authentication, task creation and editing, priority
assignment, role-based access, and a Kanban board for workflow
visualization, the project demonstrates the core functionalities required
for effective task handling.
The frontend of the system is built using Next.js, React, TypeScript,
and Tailwind CSS, ensuring a responsive and user-friendly interface.
The backend, powered by Hono.js and Prisma ORM, handles
authentication, database management, and smooth communication with
the frontend. Together, these technologies provide a modular and
scalable architecture. The inclusion of features like drag-and-drop task
management, comments, and theme switching further enhance usability
and showcase the adaptability of the design.
During the course of this project, the emphasis remained on
implementing the core features rather than achieving full industry-level
deployment. Although the current system fulfills academic
requirements, advanced features such as large-scale deployment,
enterprise security, and integration with third-party tools are yet to be
explored. Nonetheless, the project serves as a strong proof of concept
that demonstrates the potential for real-world use.
In conclusion, the Collaborative Task Handling System (CTHS) is a
valuable project that meets the objectives defined at the start and shows
potential for real-world application. It has provided practical exposure
to modern technologies, improved understanding of collaborative
workflows, and built a strong foundation for extending this academic
prototype into a more advanced system in the future.
7.2 Future Scope:
At present, the Collaborative Task Handling System (CTHS) is
designed mainly as an academic project and demonstrates only the basic
functionalities of a task management tool. However, to transform it into
an industry-ready application, several enhancements can be made in the
future:
Stronger Authentication and Security – Implementing OAuth, two-
factor authentication (2FA), and detailed role-based access to ensure
enterprise-level protection.
Scalability – Deploying on cloud platforms (AWS, Azure, GCP) with
caching and load balancing to support large teams and heavy workloads.
Tool Integration – Connecting with platforms such as Slack, Microsoft
Teams, GitHub, or Google Drive to improve collaboration.
Mobile Application – Extending the system to Android and iOS so
tasks can be managed anywhere.
Advanced Analytics – The current reporting is limited to basic task
visualization. In the future, advanced dashboards, charts, and AI-driven
insights can be implemented to help teams predict deadlines, allocate
resources efficiently, and track productivity trends.
Notifications – Adding real-time notifications (via email, SMS, or push
notifications) for task updates, deadlines, and reminders would make the
system more engaging and reliable for users
Industry-Level Deployment– The academic version runs on a local
setup. In future, it can be deployed as a Software-as-a-Service (SaaS)
platform where organizations can subscribe, onboard their teams, and
use it just like Jira or Trello.
References
References:
Next.js Documentation. (2024). Next.js – The React Framework for
Production. Retrieved from https://nextjs.org/docs
React Documentation. (2024). React – A JavaScript library for building
user interfaces. Retrieved from https://react.dev
Prisma ORM Documentation. (2024). Prisma – Next-generation Node.js
and TypeScript ORM. Retrieved from https://www.prisma.io/docs
Hono.js Documentation. (2024). Hono – Ultrafast web framework for
Cloudflare Workers, Deno, and Bun. Retrieved from https://hono.dev
Tailwind CSS Documentation. (2024). Tailwind CSS – A utility-first
CSS framework. Retrieved from https://tailwindcss.com/docs
Radix UI Documentation. (2024). Radix UI – Primitives for building
accessible design systems. Retrieved from https://www.radix-
ui.com/docs
Framer Motion Documentation. (2024). Framer Motion – A production-
ready motion library for React. Retrieved from
https://www.framer.com/motion
Fowler, M. (2003). UML Distilled: A Brief Guide to the Standard Object
Modeling Language (3rd ed.). Addison-Wesley.
Sommerville, I. (2015). Software Engineering (10th ed.). Pearson
Education.
