Collabix

📋 Overview

Collabix is a real-time team collaboration platform — Trello + Slack in one intelligent workspace. Built with Next.js 16 (App Router) and React 19, it talks to the Collabix API over REST and Socket.IO to keep a Workspace → Project → Task hierarchy, kanban board, chat, notifications, presence, and activity feed all in sync live, with no manual refreshes.

✨ Features

Kanban task board with drag-and-drop (@hello-pangea/dnd)
Real-time chat with typing indicators (Socket.IO)
Live notification center with unread counts
Real-time presence indicators for workspace & project members
Live activity feed per workspace, project & task
Auth with email/password plus Google & GitHub OAuth
Workspace invitations via emailed accept/decline links
Admin console: user management, workspace overview, manager-request review
Workspace & project dashboards with charts (Recharts)
Server-state caching & mutations via TanStack Query
Light/dark theme support
PWA support via Serwist

🛠️ Technologies Used

Next.js 16 (App Router)React 19TypeScriptTailwind CSSRadix UI / shadcnZustandTanStack QueryReact Hook Form + ZodSocket.IO Client@hello-pangea/dndMotionRecharts

📋 Prerequisites

Node.js (v20+)
npm
The Collabix API backend running

💡 Usage

Sign up or log in, create a workspace, add projects, and manage tasks on the kanban board. Chat, notifications, presence, and the activity feed update live as your team works — no refresh needed.

🚀 Deployment

Connect repository to Vercel
Configure environment variables (API_URL, NEXT_PUBLIC_API_URL, NEXT_PUBLIC_SOCKET_URL)
Deploy automatically on push to main branch

🔐 Environment Variables

Variable	Description	Example
API_URL	Backend base URL for server-side requests (Route Handlers, proxy)	http://localhost:5000
NEXT_PUBLIC_API_URL	Backend base URL exposed to the browser	http://localhost:5000
NEXT_PUBLIC_SOCKET_URL	Socket.IO server URL for realtime connections	http://localhost:5000