How hizkiagopas/nextjs-kanban-taskmanager works
This is a full-stack Kanban task manager. A user works with the board in the browser to create and view tasks, move them among To Do, In Progress, and Done, and delete them. The page calls the collection API for reads and creation and the item API for status updates and deletion. Those handlers connect to MongoDB through the cached connection helper and use the task model for persistence. The README documents the board, dynamic counts, and priority styling; the page excerpt shows those presentation features but omits some request-handler code, so only documented CRUD wiring is represented.
Main entry points: page.tsx Kanban board · tasks/route.ts Task collection API · [id]/route.ts Task item API · db.ts DB connection cache
Components 8
Board interface
- Kanban board
app/page.tsx - Root layout
app/layout.tsx
Task API
- Task collection API
app/api/tasks/route.ts - Task item API
app/api/tasks/[id]/route.ts
MongoDB persistence
- DB connection cache
lib/db.ts - Task model
models/Task.ts
Other components
- User
- MongoDB
Connections 10
- User → Root layout: opens
- Root layout → Kanban board: renders
- Kanban board → Task collection API: reads and creates
- Kanban board → Task item API: updates and deletes
- Task collection API → DB connection cache: connects through
- Task item API → DB connection cache: connects through
- Task collection API → Task model: queries and creates
- Task item API → Task model: updates and deletes
- DB connection cache → MongoDB: connects to
- Task model → MongoDB: persists tasks