📋 Kanban Board

A Modern Task Management Application

---

✨ About

A sleek, modern Kanban board application built to help you organize tasks efficiently. Featuring a beautiful dark theme, drag-and-drop functionality, and real-time updates. Built with cutting-edge technologies to demonstrate clean code practices, thoughtful design, and smooth user experiences.

🎯 Features

Feature	Description
🔐 Authentication	Secure user authentication powered by Clerk
🎨 Modern UI	Beautiful dark theme with smooth animations
🖱️ Drag & Drop	Intuitive task management with DnD Kit
📊 Statistics	Visual task statistics with Recharts pie charts
🔍 Search	Quick search functionality to find tasks
📱 Responsive	Fully responsive design for all devices
⚡ Real-time	Optimistic updates for instant feedback
🗄️ Serverless DB	PostgreSQL database hosted on Neon

🛠️ Tech Stack

Frontend

Technology	Version	Description
	16.0.6	React framework with App Router
	19.1.0	JavaScript library for building UIs
	5.x	Type-safe JavaScript development
	4.x	Utility-first CSS framework

Backend & Database

Technology	Version	Description
	7.1.0	Next-generation ORM
	Neon	Serverless PostgreSQL database
	7.x	Authentication & user management

UI & Components

Technology	Description
	Re-usable components built with Radix UI and Tailwind
	Unstyled, accessible UI primitives
	Beautiful & consistent icons
	Composable charting library
	Drag and drop toolkit
	Beautiful toast notifications

🚀 Getting Started

Prerequisites

• Node.js 18.x or higher
• npm or pnpm
• PostgreSQL database (Neon recommended)

Installation

1️⃣ Clone the repository

git clone https://github.com/viboverse/linear-kanban.git
cd linear-kanban

2️⃣ Install dependencies

npm install
# or
pnpm install

3️⃣ Set up environment variables

cp .env.example .env

Update .env with your credentials:

# Database
DATABASE_URL="postgresql://..."

# Clerk Authentication
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY="pk_..."
CLERK_SECRET_KEY="sk_..."
NEXT_PUBLIC_CLERK_SIGN_IN_URL="/sign-in"
NEXT_PUBLIC_CLERK_SIGN_UP_URL="/sign-up"
NEXT_PUBLIC_CLERK_SIGN_IN_FALLBACK_REDIRECT_URL="/"
NEXT_PUBLIC_CLERK_SIGN_UP_FALLBACK_REDIRECT_URL="/"

4️⃣ Initialize the database

npx prisma migrate dev --name init
npx prisma generate

5️⃣ Start the development server

npm run dev

6️⃣ Open your browser

Navigate to http://localhost:3000 🎉

🤝 Contributing

Contributions are welcome! Feel free to:

1. Fork the project
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📬 Contact

Email - vahab.afsharian94@gmail.com

GitHub - @viboverse

Project Link - https://github.com/viboverse/linear-kanban

---

⭐ Star this repo if you find it helpful!

Built with ❤️ by LazyBee