← Back
Projects
Kanban Board App
Real-time collaborative Kanban with role-based access, optimistic updates, labels, assignees, and drag-and-drop.
Project Snapshot
- Role
- Frontend Developer
- Product type
- Real-time collaboration
- Scope
- Boards, roles & drag-and-drop
- Quality & delivery
- Emulator E2E & rules coverage
Stack
- Next.js App Router
- React 19
- TypeScript
- Redux Toolkit / RTK Query
- Firebase Auth + Firestore + Admin SDK
- dnd-kit
- Radix UI / shadcn/ui
- Vitest + Cypress
Context
A real-time collaboration workspace where board changes, permissions, and drag-and-drop need to remain predictable across clients.
Constraints
- Keeping Firestore listeners, the RTK Query cache, optimistic mutations, and drag-and-drop order consistent across clients.
- Enforcing owner, editor, and viewer permissions across the interface, Firestore rules, and server-owned operations.
- Evolving the data model for shared labels, multiple assignees, and legacy records without exposing credentials or letting tests write to production.
Key Decisions
- Synchronize through Firestore listeners and RTK Query. Structure boards, columns, cards, participants, and invites around live listeners and optimistic patches so interactions stay responsive.
- Move sensitive mutations into validated API routes. Use Firebase Admin for atomic board creation, invite acceptance, role changes, and cascade deletes.
- Test against isolated Firebase emulators. Cover E2E flows and Firestore rules without allowing tests to write to production.
Verified Outcomes
- Delivered a bilingual real-time workspace with owner, editor, and viewer roles.
- Kept interactions responsive with Firestore listeners, RTK Query cache updates, and optimistic mutations.
- Added isolated Firebase Emulator E2E and Firestore-rules coverage to protect production data during testing.