A modern project management application built with SvelteKit that replicates core Trello functionality for team collaboration and task management.
This Trello Clone is a comprehensive project management platform designed to help teams organize, track, and manage their work efficiently. Built with modern web technologies, it provides a familiar Kanban-style interface for managing tasks across different project boards.
The application features a multi-tenant architecture with organization support, allowing teams to collaborate on projects while maintaining data isolation. Users can create boards, organize tasks in columns, assign work to team members, set priorities and due dates, and track project progress in real-time.
Key highlights include drag-and-drop task management, real-time collaboration, user authentication with social login support, comprehensive filtering and search capabilities, and a responsive design that works across all devices.
- SvelteKit - Full-stack web framework with SSR support
- Svelte 5 - Reactive UI framework with modern syntax
- TypeScript - Type-safe JavaScript development
- TailwindCSS - Utility-first CSS framework
- Bits UI - Accessible component library for Svelte
- Lucide Svelte - Beautiful icon library
- Drizzle ORM - Type-safe SQL toolkit and query builder
- SQLite - Lightweight, serverless database
- Better Auth - Modern authentication library
- Drizzle Kit - Database migration and introspection tools
- Upstash Redis - Serverless Redis for high-performance caching
- Tailwind - Utility css classes
- Shadcn - UI component library
- Mode Watcher - Dark/light theme management
- Svelte Sonner - Toast notification system
- SvelteKit Superforms - Advanced form handling
- Formsnap - Form component library
- Zod - Schema validation library
- Vite - Fast build tool and dev server
- Vitest - Unit testing framework
- Playwright - End-to-end testing
- ESLint - Code linting and formatting
- Bun - Fast JavaScript runtime and package manager
- svelte-dnd-action - Drag and drop functionality for Svelte
- nanoid - Unique ID generation
- es-toolkit - Modern utility library. Alternative to loadash
- Email/Password Authentication - Secure user registration and login
- Google OAuth Integration - Social login support
- User Profile Management - Update profile information and passwords
- Session Management - Secure session handling with cookie-based authentication
- Multi-tenant Architecture - Support for multiple organizations
- Automatic Organization Creation - Default organization created for new users
- Team Member Invitations - Invite users to join organizations
- Role-based Access Control - Owner and member roles with appropriate permissions
- Kanban-style Boards - Visual project management with customizable columns
- Board Creation & Customization - Create boards with custom titles, descriptions, and colors
- Board Filtering & Search - Advanced filtering by date, creator, and search terms
- Board Statistics - Overview of board metrics and activity
- Soft Delete Support - Trash and restore functionality for boards
- Task Creation & Editing - Create detailed tasks with titles and descriptions
- Priority Levels - Set task priorities (Low, Medium, High)
- Due Date Management - Set and track task deadlines
- Task Assignment - Assign tasks to team members
- Drag & Drop Interface - Intuitive task movement between columns
- Task Sorting - Custom sort order within columns
- Dynamic Column Management - Create and customize board columns
- Column Reordering - Organize columns in preferred order
- Editable Column Titles - Rename columns as needed
- Task Organization - Group tasks by workflow stages
- Text Search - Search boards by title and description
- Date Range Filtering - Filter by creation and update dates
- Creator Filtering - Filter boards by specific users
- Multi-criteria Sorting - Sort by various attributes (date, title, owner)
- View Modes - Grid and list view options
- Responsive Design - Works seamlessly on desktop, tablet, and mobile
- Dark/Light Theme Support - Toggle between theme modes
- Modern UI Components - Clean, accessible interface components
- Toast Notifications - Real-time feedback for user actions
- Loading States - Smooth loading indicators and transitions
- Type Safety - Full TypeScript support throughout the application
- Database Migrations - Automated schema management with Drizzle
- Seed Data - Development database seeding capabilities
- Comprehensive Testing - Unit and E2E testing setup
- Code Quality - ESLint configuration for consistent code style
- Personal Dashboard - Overview of user's boards and activities
- Board Statistics - Member count and invitation tracking
- Activity Tracking - Monitor board and task updates
- User Workspace - Centralized view of all user projects
- Redis Caching - High-performance caching with Upstash Redis for improved response times
- Cache-Aside Pattern - Intelligent caching strategy for board and task data
- Automatic Cache Invalidation - Smart cache invalidation on data updates
- Configurable TTL - Optimized cache expiration times for different data types
- Graceful Degradation - Application continues to work even if cache is unavailable
Login Page - Secure authentication with email/password and Google OAuth
Sign Up Page - User registration with form validation
Dashboard Page - Overview of all boards and project statistics
Organization Switching - Multi-tenant support for different workspaces
Team Invitations - Invite team members to join your organization
Invitation Management - Track and manage pending invitations
Kanban Board - Drag-and-drop task management with customizable columns
Advanced Filtering - Search and filter boards by various criteria
Account Management - Update profile information and settings
Trash Management - View and restore deleted boards
- Node.js (v18 or higher)
- Bun (recommended) or npm/yarn
- Clone the repository:
git clone <repository-url>
cd jira-clone- Install dependencies:
bun install- Set up environment variables:
cp .env.example .envFill in the required environment variables in .env, including:
- Database configuration (SQLite)
- Authentication providers (Google OAuth)
- Redis configuration (Upstash Redis URL and token)
- Set up the database:
bun run db:push- Seed the database (optional):
bun run dev
# now navigate to `http://localhost:3000/db-seed`Start the development server:
bun run dev
# or start the server and open the app in a new browser tab
bun run dev -- --openTo create a production version of your app:
bun run buildYou can preview the production build with bun run preview.
- Push schema changes:
bun run db:push - Generate migrations:
bun run db:generate - Run migrations:
bun run db:migrate - Open Drizzle Studio:
bun run db:studio
- Run unit tests:
bun run test - Run tests in watch mode:
bun run test:unit
To deploy your app, you may need to install an adapter for your target environment. This project is configured with the Vercel adapter by default.
This project is licensed under the terms specified in the LICENSE file.