Coordina
Modern project & task management with Kanban boards, calendar views, analytics, and collaborative workspaces.
📋 Plan, prioritize, and track your projects in one cohesive workspace
Coordina lets you structure work into projects, visualize tasks on Kanban boards and calendars, and keep teams aligned with analytics and a polished, responsive UI.
🔍 What is Coordina?
Coordina is a sleek, opinionated project & task management platform. It combines Kanban boards, full-calendar scheduling, analytics dashboards, and multi-workspace collaboration into a single, fast Next.js app. Users can create projects, invite members, prioritize work with labels and due dates, and track progress over time via charts.
🧩 Key Features
📌 Why I Built This
I wanted a project management tool that felt as polished as Linear but was fully under my control, both as a real-world productivity app and as a playground for modern React, Next.js, Appwrite, and React Query patterns. Coordina is my take on a focused, opinionated project & task manager that I would happily use for personal and client work.
💡 Use Cases
- Plan sprints with Kanban boards and track progress across multiple projects.
- Manage personal tasks, side projects, and long-running initiatives in one dashboard.
- Organize client work in separate workspaces and keep deliverables clearly scoped.
- Use the calendar view to align deadlines, avoid overload, and plan upcoming weeks.
- Review analytics to see where tasks get stuck and how workload is distributed.
🧪 Tech Stack Overview
- Next.js - App Router-based React framework for routing, layouts, and API routes, giving Coordina a structured dashboard shell and smooth navigation.
- React - Component-driven UI with hooks for interactive Kanban boards, forms, and real-time feedback in the workspace experience.
- TypeScript - Strongly typed models for workspaces, projects, and tasks, reducing runtime errors and keeping the data layer predictable.
- Tailwind CSS - Utility-first styling for the modern dashboard look, responsive layouts, and consistent spacing, typography, and theming.
- Appwrite - Handles auth, databases, and storage for multi-workspace data, permissions, and secure project/task persistence.
- React Query - Data fetching and caching layer powering optimistic updates, background refetching, and a snappy UX across boards and calendars.
⚙️ Getting Started
🧠 Challenges & Learnings
- Designing a workspace → project → task hierarchy with Appwrite collections keeps permissions manageable and scales better than a flat task model.
- Combining React Query with optimistic updates makes drag-and-drop interactions feel instant while still respecting backend validation.
- Building a Kanban board with @hello-pangea/dnd requires careful handling of indices and IDs to avoid flicker and inconsistent ordering.
- Integrating react-big-calendar with typed task data surfaces calendar edge cases (time zones, all-day vs timed events) early in the design.
- Centralizing validation with Zod on both the client and Hono API routes reduces duplicated logic and prevents invalid task states from leaking into the UI.
📸 See it in Action
Want to chat about this project? Let’s chat.