How ajay127955/trello-clone works
Trello-Clone is a Django/React kanban task-management app. Users register or sign in, open a dashboard and board, then organize work into cards with details such as labels, due dates, assignments, and checklists. The tree also identifies invitations, activity, owner dashboard, and social simulation features. Sampled source confirms authentication requests, card-detail operations, and board WebSocket messaging; backend endpoint wiring and unsampled feature internals are not shown, so those relationships are kept broad.
Main entry points: api.js HTTP API client · views.py Request handlers · AuthContext.jsx Authentication · models.py Kanban domain models
Components 20
Web application
- Sign in / onboarding
frontend/src/pages/Login.jsx - Authentication
frontend/src/context/AuthContext.jsx - Dashboard
frontend/src/pages/Dashboard.jsx - Board view
frontend/src/pages/BoardView.jsx - Card details
frontend/src/components/CardModal.jsx - Activity stream
frontend/src/components/ActivityStream.jsx - Invitations
frontend/src/components/InviteModal.jsx - Owner dashboard
frontend/src/components/OwnerDashboard.jsx - Social simulation
frontend/src/components/SocialSimulationModal.jsx - HTTP API client
frontend/src/services/api.js
Backend API
- Request handlers
backend/kanban/views.py - API serializers
backend/kanban/serializers.py - Access permissions
backend/kanban/permissions.py
Live collaboration
- Board socket hook
frontend/src/hooks/useBoardSocket.js - WebSocket consumer
backend/kanban/consumers.py - Socket routing
backend/kanban/routing.py
Persistence
- Kanban domain models
backend/kanban/models.py - Application database
backend/config/settings.py
Other components
- Team member
- Google OAuth
Connections 21
- Team member → Sign in / onboarding: starts session
- Sign in / onboarding → Authentication: submits credentials
- Authentication → HTTP API client: sends auth requests
- Google OAuth → Authentication: provides login token
- Team member → Dashboard: opens workspace
- Dashboard → Board view: opens board
- Team member → Card details: edits card
- Card details → HTTP API client: loads and updates
- Invitations → HTTP API client: sends requests
- Activity stream → HTTP API client: loads activity
- Owner dashboard → HTTP API client: requests data
- Social simulation → HTTP API client: requests actions
- HTTP API client → Request handlers: HTTP requests
- Request handlers → Access permissions: checks access
- Request handlers → API serializers: processes API data
- Request handlers → Kanban domain models: reads and writes
- Kanban domain models → Application database: persists records
- Board view → Board socket hook: uses board updates
- Board socket hook → Socket routing: connects by board
- Socket routing → WebSocket consumer: routes socket
- WebSocket consumer → Kanban domain models: accesses board data