Vibe Kanban
repository·main·Indexed 12 days ago
https://github.com/bloopai/vibe-kanbanA planning and execution platform for software engineers using AI coding agents. It features kanban boards for task planning and workspaces where agents (such as Claude, Amp, or Echo) can execute tasks with access to git branches, terminals, and dev servers. The platform supports isolated git worktrees, one-click merging, and integration with editors like VS Code, Cursor, and Zed.
What's inside Vibe Kanban
- Vibe Kanban Cloud is a collaborative extension of the standard Vibe Kanban experience. It enables real-time team synchronization, cloud-based data storage, and multi-user access. While Local projects are stored on your computer and work offline, Cloud projects are synced to the cloud and require an internet connection and sign-in (via GitHub or Google) to access and collaborate.
Overview of @vibe/ui package
mainThe@vibe/uipackage provides shared UI primitives and reusable web application components for the Vibe Kanban ecosystem. It includes package scaffolding, exports, and shared utility helpers likecn(typically used for conditional Tailwind class merging).Key Features of the Workspaces UI
mainThe Workspaces UI provides several integrated tools for an AI-assisted development workflow:
- Multi-Repository Support: Work across multiple repositories in one workspace, allowing you to reference code from one while implementing changes in another.
- Multiple Sessions: Run multiple agent conversations simultaneously to manage context or work around token limits.
- Browser Testing: Use the built-in browser preview to test changes across desktop, mobile, and custom viewports.
- Changes Panel: Review code modifications via syntax-highlighted diffs and provide feedback through inline comments.
- Integrated Terminal: Run commands directly within the workspace environment.
- Workspace Notes: Document important information specific to the current workspace.
- Command Bar: A central navigation hub for quick actions and keyboard shortcuts.
Available Coding Agents in Vibe Kanban
mainVibe Kanban integrates with several coding agents to facilitate task attempts. Each agent must be installed and authenticated on your system before it can be selected within the Vibe Kanban interface.
Supported agents include:
- Claude Code: Claude Code CLI
- OpenAI Codex: OpenAI Codex CLI
- GitHub Copilot: GitHub Copilot CLI
- Gemini CLI: Google Gemini CLI
- Amp: Amp Code
- Cursor Agent CLI: Cursor Agent CLI
- OpenCode: SST OpenCode
- Droid CLI: Factory Droid
- Claude Code Router: Orchestrates multiple models
- Qwen Code: Qwen Code CLI
What is a Project in Vibe Kanban?
mainA project is a container for related work within your organisation, serving as a dedicated space for a specific initiative, product, or team goal.
Each project includes:
- Issues: Individual work items like bugs, features, or tasks.
- Statuses: Columns on your kanban board (e.g., To Do, In Progress, Done).
- Tags: Labels used for categorising issues.
- Team access: All organisation members can view and work on project issues.
What is an Issue in Vibe Kanban?
mainAn issue is a single work item (e.g., bug, feature, task) tracked on a kanban board. Each issue contains the following properties:
- Title: A short description of the work.
- Description: Detailed context or requirements (supports rich text).
- Status: The current column (e.g., To Do, In Progress, Done).
- Priority: Urgency level (Urgent, High, Medium, Low).
- Assignees: Team members responsible for the work.
- Tags: Labels for categorization and filtering.
- Simple ID: A unique identifier (e.g.,
TASK-123).
What is a task attempt and when to create one
mainA task attempt represents a single session with a coding agent working against a specific task. While most tasks require only one attempt, you should create additional attempts when you need a fresh restart with different configurations.
Use a new task attempt to:
- Start from scratch with a different approach after an unsuccessful attempt.
- Try a different coding agent (e.g., switching from Claude to Codex).
- Use a different agent profile or variant for specialized behavior.
- Work from a different base branch to incorporate recent changes.
- Reset the conversation context for a completely fresh start.
What is a workspace in Vibe Kanban
mainA workspace is a task execution environment where you work with coding agents. It provides an isolated environment for your development tasks through the following mechanisms:
- Git Worktrees: Vibe Kanban creates a separate working directory (a git worktree) for each workspace. This keeps your changes isolated from your main codebase. Worktrees are stored in a
.vibe-kanban-workspacesdirectory (configurable in Settings → General → Workspace Directory). - Working Branches: A new branch is automatically created based on your chosen target branch (e.g.,
main). The branch name is auto-generated based on your task description (e.g.,vk/abc123-add-login-page). - Agent Sessions: A coding agent is initialized within the workspace to read files, make changes, and run commands.
- Setup Scripts: If configured in your repository, setup scripts (like
npm install) run automatically to prepare the environment.
- Git Worktrees: Vibe Kanban creates a separate working directory (a git worktree) for each workspace. This keeps your changes isolated from your main codebase. Worktrees are stored in a
What is a Workspace in Vibe Kanban?
mainA workspace is an isolated, IDE-like environment designed for completing specific coding tasks using AI coding agents. It serves as a dedicated "project room" where you can chat with agents, review code changes, test applications via a built-in browser, and eventually create pull requests.
Core Workflow
- Describe a task in plain English.
- AI agents implement the code changes.
- Review and iterate by checking diffs and providing feedback.
- Test and submit using the integrated preview browser and PR tools.
Overview of Settings tabs
mainThe Settings dialog is organized into several functional tabs:
Tab Description General Appearance, default agent, editor, git, and notifications Projects Project-specific settings Repositories Repository scripts (dev server, setup, cleanup) Organization Settings Organisation members, invitations, and settings Remote Projects Cloud-synced projects across organisations Agents Agent profiles and variants MCP Servers Model Context Protocol server configuration Understand the Frontend UI Refactor Strategy
mainThe frontend architecture is being transitioned from a monolithic structure in
packages/local-web/src/componentsto a modular system using a new@vibe/uipackage. The refactor follows a specific categorization for components to ensure proper decoupling:extract-now: These components are the highest priority for the first wave of the@vibe/uipackage migration. They typically include core UI elements fromcomponents/uiand specificcomponents/ui-new/primitives.extract-later: Reusable components that should only be moved to the UI library after their APIs and dependencies have been decoupled from the main application.keep-app: Components that should remain within the frontend application package. These are typically feature-specific, domain-driven, or integration-focused UI elements (e.g.,containers,views, and feature-specificdialogs).
Understand List View Layout and Row Details
mainIssues in the List View are grouped by status. Each status section includes:
- Status name with a color indicator.
- Issue count for that specific status.
- Collapsible sections that can be expanded or collapsed.
Issue Row Information
Each row displays the following metadata:
- Simple ID: The unique identifier (e.g.,
ISS-1). - Title: The name of the issue.
- Workspace indicator: Indicates if the issue has linked workspaces.
- Age: The time elapsed since creation (e.g.,
12d).
Clicking any row opens the full issue panel.