Skip to content

replit.md

Latest commit

 

History

History
75 lines (60 loc) · 3.49 KB

replit.md

File metadata and controls

75 lines (60 loc) · 3.49 KB
Raw

Project Management System

Overview

This is a full-stack project management application built with React (TypeScript) frontend and Flask (Python) backend. The system provides role-based user management, project creation and oversight, and task tracking with drag-and-drop functionality. It supports three user roles with different permission levels: Administrators, Project Managers, and Coordinators, enabling hierarchical project and task management workflows.

User Preferences

Preferred communication style: Simple, everyday language.

System Architecture

Frontend Architecture

  • Framework: React 19 with TypeScript for type safety
  • UI Library: Material-UI (MUI) for consistent design components
  • GraphQL Client: Apollo Client for data fetching and state management
  • Routing: React Router DOM for client-side navigation
  • Drag & Drop: React DnD with HTML5 backend for task status management
  • Authentication: JWT token-based authentication with localStorage persistence
  • State Management: React Context API for global auth state

Backend Architecture

  • Framework: Flask with Python for RESTful API services
  • GraphQL: Ariadne for GraphQL schema implementation and resolvers
  • ORM: SQLAlchemy with Flask-SQLAlchemy for database operations
  • Authentication: JWT tokens using Flask-JWT-Extended
  • Password Security: Bcrypt for password hashing
  • CORS: Flask-CORS for cross-origin resource sharing
  • Database: Configurable database support (SQLite for development, PostgreSQL for production)

Data Model

  • Users: Email/username authentication with role-based permissions (Admin, Project Manager, Coordinator)
  • Projects: Owned by users with associated tasks
  • Tasks: Assigned to users with status tracking (TODO, IN_PROGRESS, COMPLETED)
  • Relationships: One-to-many between users-projects and projects-tasks

Authentication & Authorization

  • JWT-based authentication with token validation middleware
  • Role-based access control with decorator functions
  • Permission hierarchy: Admin > Project Manager > Coordinator
  • Route protection with role-specific access controls

API Design

  • GraphQL endpoint at /graphql for all data operations
  • Type-safe schema with enums for roles and task statuses
  • Mutation and Query resolvers for CRUD operations
  • Context-aware resolvers with user authentication checks

External Dependencies

Frontend Dependencies

  • @apollo/client: GraphQL client library for data management
  • @mui/material: Material Design component library
  • react-dnd: Drag and drop functionality for task management
  • react-router-dom: Client-side routing and navigation
  • graphql: GraphQL query language implementation

Backend Dependencies

  • ariadne: GraphQL schema-first library for Python
  • flask: Micro web framework for Python
  • flask-sqlalchemy: SQLAlchemy integration for Flask
  • flask-jwt-extended: JWT authentication extension
  • bcrypt: Password hashing library
  • psycopg2-binary: PostgreSQL database adapter
  • gunicorn: WSGI HTTP server for production deployment

Database

  • SQLite: Development database (default)
  • PostgreSQL: Production database with SSL support
  • Configurable via DATABASE_URL: Environment variable for database connection

Development Tools

  • React Scripts: Build tooling for React development
  • TypeScript: Static type checking for JavaScript
  • Create React App: Bootstrap tooling for React applications