2026 · Design and full-stack development

Tasks Management

TaskFlow, a bilingual kanban task manager with boards, drag-and-drop tasks, and Supabase auth.

Overview

TaskFlow, a kanban-style task manager in English and Khmer, built end to end as a portfolio project.
Built with Next.js 16 (App Router, Cache Components, Server Actions), TypeScript, Tailwind CSS 4, and shadcn/ui on Base UI.
Supabase provides Postgres, Row Level Security, and email and password auth through server-side cookies.
Boards hold columns and tasks. Tasks carry a priority, description, and due date, and overdue tasks are flagged.
Drag and drop with dnd-kit: reorder tasks within and across columns and reorder columns, with positions saved to the database.
Search and filters on every board: text, priority, and overdue only, plus client-side search across boards.
All writes go through Server Actions validated with Zod, and the database policies make every board, column, and task owner-only.
Protected routes, email confirmation, a profile page, per-language fonts, light and dark mode, and a mobile-first layout.
Ready for production: sitemap, robots, Open Graph metadata, hreflang alternates, loading skeletons, and translated error states.

Boards list with search, on desktop and mobile.

Profile page with account details, stats, and display-name editing, on desktop and mobile.

Drag-and-drop kanban with persisted task and column positions, usable by pointer, touch, and keyboard.

Owner-only data enforced in the database with Row Level Security, not just in the UI.

Session refreshed on every request, with cookie-only redirects for protected and auth-only routes.

Server Actions with Zod validation and translated error messages for every create, update, move, and delete.

Locale detected from a cookie, then Accept-Language, with dictionaries loaded on the server so translations never ship whole to the browser.

One SQL migration sets up tables, policies, indexes, and a trigger that creates a profile for every new user.

Next.jsTypeScriptTailwind CSSSupabasePostgreSQLdnd-kitZod