{"id":24585674,"url":"https://github.com/ahmedtrb/project-management-web-app","last_synced_at":"2025-10-09T05:33:25.773Z","repository":{"id":273107273,"uuid":"918722026","full_name":"AhmedTrb/Project-Management-web-app","owner":"AhmedTrb","description":"This project is a task management and visualization tool designed to help users create, organize, and manage tasks within a project. The tool leverages a visual graph-based representation to display task dependencies.","archived":false,"fork":false,"pushed_at":"2025-03-06T13:27:17.000Z","size":3113,"stargazers_count":6,"open_issues_count":0,"forks_count":3,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-06T13:29:20.777Z","etag":null,"topics":["nextjs","postgresql","prisma","project-management","topological-sort","typescript"],"latest_commit_sha":null,"homepage":"https://project-management-web-app-lilac.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/AhmedTrb.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-01-18T17:27:42.000Z","updated_at":"2025-03-06T13:27:20.000Z","dependencies_parsed_at":"2025-01-18T18:43:27.910Z","dependency_job_id":"64340821-316e-41a9-a804-d350a9ff5c34","html_url":"https://github.com/AhmedTrb/Project-Management-web-app","commit_stats":null,"previous_names":["ahmedtrb/project-management-web-app"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AhmedTrb%2FProject-Management-web-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AhmedTrb%2FProject-Management-web-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AhmedTrb%2FProject-Management-web-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AhmedTrb%2FProject-Management-web-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/AhmedTrb","download_url":"https://codeload.github.com/AhmedTrb/Project-Management-web-app/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244085031,"owners_count":20395523,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["nextjs","postgresql","prisma","project-management","topological-sort","typescript"],"created_at":"2025-01-24T05:14:19.407Z","updated_at":"2025-10-09T05:33:25.765Z","avatar_url":"https://github.com/AhmedTrb.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Project-Management-web-app\n\nThis project is a task management and visualization tool designed to help users create, organize, and manage tasks within a project. \nThe tool leverages a visual graph-based representation to display task dependencies.\n\n*** \n### Insipiration :\nThis project was inspired by a university course on Graph Theory, where I explored topological sorting to determine task degrees and optimize project visualization. Currently, I use topological sorting in this project to:\n\n- Calculate the degree of each task based on its dependencies.\n- Determine the positioning of tasks in the graph view.\n- Improve the visualization of task dependencies for better project planning.\n- Reschedule tasks dynamically – When a task is delayed or updated, its dependent tasks are automatically adjusted to maintain a consistent and valid project timeline, ensuring all constraints are respected.\n\n[VIDEO DEMO](https://drive.google.com/file/d/1nH3_EfDSxEBc-k4HovFmLGog7LNgxCe4/view?usp=sharing)\n\n[Live Demo website](https://project-management-web-app-lilac.vercel.app)\n\n- email : test@gmail.com\n- password : 1111\n*** \n\n![image](https://github.com/user-attachments/assets/cf75824e-a7da-4e8a-ad49-f267d6574099)\n\n\n\n*** \n### Overview : \nPrerequisites :\nNode.js (v16+ recommended)\nPostgreSQL  (configured in .env file)\nPrisma ORM\n\n- [Features](#1-features)\n- [Project Structure](#2-project-structure-)\n- [Project setup](#3-setup-)\n- [Database setup](#4-database-setup-)\n\n***\n### 1. Features\n\n- Project \u0026 Task Management – Create and manage projects, assign tasks, and track progress.\n- Graph View (DAG Representation): Visualize project dependencies as a Directed Acyclic Graph (DAG) using topological sorting.\n- Team Collaboration: Assign team members to projects, manage roles.\n- Task Rescheduling (Gantt View) – Reschedule tasks by dragging them on a Gantt chart. Updates automatically propagate to dependent tasks.\n- Real-Time Messaging – Collaborate with your team using built-in messaging within each project workspace.\n- Authentication \u0026 Authorization : Secure login with jwt Refresh and Access tokens\n- Responsive \u0026 Modern UI : Designed with TailwindCSS for a clean and intuitive user experience.\n\n### 2. Project Structure :\n```bash\n# Frontend folder\nclient/\n├── .next/\n├── node_modules/\n├── public/\n├── src/\n│   ├── app/\n├── .env\n# backend folder\nserver/\n├── prisma/\n│   ├── migrations/\n│   └── schema.prisma\n├── src/\n│   ├── controllers/\n│   ├── middleware/\n│   ├── routes/\n│   └── utils/\n├── .env\n```\n### 3. Setup :\n\n```bash\n# Clone the repository\ngit clone https://github.com/AhmedTrb/Project-Management-web-app.git\n```\nInstall npm packages :\n\n```bash\ncd project-management-platform\n```\n**Install dependencies**\n```bash\ncd client\nnpm install --legacy-peer-deps\n```\n```bash\ncd server\nnpm install\n```\n\nCreate an environment variables file :\n\n**Frontend :** \n\n```bash \nNEXT_PUBLIC_API_BASE_URL=http://localhost:8000\n\n```\n**Backend .env file :** \n\n``` \nPORT=8000\nDATABASE_URL=postgresql://postgres:\u003cDatabase password\u003e@localhost:5432/\u003cdb name\u003e?schema=public\n\nJWT_ACCESS_TOKEN_SECRET=1234567890\nJWT_REFRESH_TOKEN_SECRET=0987654321\n\nSTATUS=development\n\nFRONTEND_URL=http://localhost:3000\n\n```\n### 4. Database setup :\n**For local database:**\n- install PgAdmin \n- create a new postgres database \n- save database name and password\n- update DATABSE_URL in .env file in server directory\n- create database with the commands : \n\n- Or use Neon as a database provider\n    ```bash \n    cd server\n    npx prisma migrate dev --name init\n    ```\n### 5. Running the project :\n```bash\n    cd client\n    npm run dev\n```\n```bash\n    cd server\n    npm run dev\n```\n\n### Screenshots : \n\n#### Home Page \n![image](https://github.com/user-attachments/assets/9d3e45c9-5b99-40eb-ab06-5f14a3ddaab4)\n\n#### Project Page (Board view) :\n![image](https://github.com/user-attachments/assets/2ea65bdd-a1d1-469e-a9ca-e54d4d25f196)\n\n#### Project Page (Graph view) :\n![image](https://github.com/user-attachments/assets/cf75824e-a7da-4e8a-ad49-f267d6574099)\n#### Members Page :\n![image](https://github.com/user-attachments/assets/f957f838-4aba-4e62-87b2-6b699bada2e5)\n\n#### Gantt View :\n\u003cimg width=\"1853\" height=\"914\" alt=\"image\" src=\"https://github.com/user-attachments/assets/1e8772fd-5269-4689-90fd-da1467dbc675\" /\u003e\n\n#### Team Messaging :\n\u003cimg width=\"1853\" height=\"994\" alt=\"image\" src=\"https://github.com/user-attachments/assets/e29e7048-1a81-492a-87b0-79d71084822a\" /\u003e\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fahmedtrb%2Fproject-management-web-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fahmedtrb%2Fproject-management-web-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fahmedtrb%2Fproject-management-web-app/lists"}