17 / 20Product UX
Kanban Board
Drag-and-drop task board that works by mouse, touch and keyboard, with optimistic updates.
- Drag and drop
- Keyboard DnD
- Optimistic UI
- Undo
stirling.lab/kanban Live demo
Loading demo…
What to notice
- Pointer-based drag with auto-scroll and animated drop placeholders
- Fully keyboard-operable drag (space to lift, arrows to move) with announcements
- Optimistic moves that roll back with a toast if the fake API fails
- Filters, WIP limits, and undo
How it's built
- Built on pointer events directly; HTML5 drag-and-drop is avoided because of its touch and styling limits.
- Moves are commands: apply → persist → confirm, or revert.
Hand-built in React 19 + TypeScript, with no UI or chart libraries.