Kaiban Board

The Visual Interface for Managing AI Agent Teams

---

Kanban for AI Agents? 🤖📋

Kaiban Board is an experimental UI designed to help you visualize, manage, and share your AI agent teams in a Kanban-style interface. Built on top of KaibanJS, it provides a powerful way to:

• 🔨 Create and manage AI agent teams visually
• 📊 Track tasks and workflows in real-time
• 🤝 Collaborate with your AI agents
• 🎯 Monitor progress and performance
• 🔍 Debug and optimize your AI workflows

Setup

Prerequisites

• Node.js (v18 or higher)
• npm or yarn
• Git

Local Development

1. Clone the repository:

git clone https://github.com/kaiban-ai/kaiban-board.git
cd kaiban-board

2. Install dependencies:

npm install
# or
yarn install

3. Set up environment variables:

cp .env.example .env.local

Edit .env.local and add your API keys.

4. Start the development server:

npm run dev
# or
yarn dev

Testing with Storybook

Storybook provides an isolated environment to develop and test the Kaiban Board component:

1. Start Storybook:

npm run storybook
# or
yarn storybook

2. Open your browser and navigate to http://localhost:6006

Manual Installation and Usage

If you prefer to set up Kaiban Board manually follow these steps:

1. Install Kaiban Board via npm:

npm install kaiban-board

2. Import Kaiban Board in your JavaScript file:

// Using ES6 import syntax for NextJS, React, etc.
import KaibanBoard from 'kaiban-board';
import 'kaiban-board/dist/index.css';

3. Basic Usage Example

const teams = [
  // Define your teams and tasks here
];

const uiSettings = {
  //showWelcomeInfo: false
};

function App() {
  return (
    <div>
      <KaibanBoard teams={teams} uiSettings={uiSettings} />
    </div>
  );
}

export default App;

Community and Support

Join the Discord community to connect with other developers and get support. Follow us on Twitter for the latest updates.

Contributing

We welcome contributions from the community. Please read the contributing guidelines before submitting pull requests.

Development Process

1. Fork the repo and create your branch from main
2. Make your changes and test them thoroughly
3. Ensure your code lints (npm run lint)
4. Issue a pull request

Pull Request Process

1. Update the README.md with details of changes if needed
2. Update the .env.example if you've added new environment variables
3. The PR will be merged once you have the sign-off of at least one maintainer

Code Style

• Use Prettier for code formatting
• Follow the existing code style
• Write meaningful commit messages
• Add comments for complex logic

License

Kaiban Board is MIT licensed. See the LICENSE file for the complete license text.

For any questions or support, feel free to:

• Open an issue on GitHub
• Join our community discussions
• Contribute to the project