KaibanJS受到久經考驗的看板方法的啟發,該方法以幫助團隊組織和管理他們的工作而聞名。我們對這些概念進行了調整,以應對人工智慧代理管理的獨特挑戰。
如果您使用過 Trello、Jira 或 ClickUp 等工具,您就會熟悉看板如何協助管理任務。現在,KaibanJS 使用同一系統來幫助您即時管理 AI 代理程式及其任務。
使用 KaibanJS,您可以:
創建、視覺化和管理 AI 代理、任務、工具和團隊
無縫編排 AI 工作流程
即時視覺化工作流程
追蹤任務在不同階段的進展
在 AI 專案上更有效地協作
探索 Kaiban Board——它就像 Trello 或 Asana,但適用於 AI 代理和人類。
一分鐘內即可開始使用 KaibanJS:
1. 在專案目錄中執行 KaibanJS 初始化程序:
npx kaibanjs@最新 init
2. 將您的 AI 服務 API 金鑰新增至.env
檔:
VITE_OPENAI_API_KEY=your-api-key-here
3. 重新啟動 Kaiban 板:
npm 運行 Kaiban
按一下「啟動工作流程」以運行預設範例。
觀看代理在任務板上即時完成任務。
在結果概述中查看最終輸出。
KaibanJS 不僅限於 Kaiban Board。您可以將其直接整合到您的專案中、建立自訂 UI 或在沒有 UI 的情況下運行代理程式。探索我們的 React 和 Node.js 整合教學課程,以在各種開發環境中釋放 KaibanJS 的全部潛力。
如果您喜歡手動設定 KaibanJS,請按照以下步驟操作:
npm 安裝 kaibanjs
// 使用 ES6 導入語法 import { Agent, Task, Team } from 'kaibanjs';
// 對 NodeJSconst 使用 CommonJS 語法 { Agent, Task, Team } = require('kaibanjs');
// 定義一個代理程式 const ResearchAgent = new Agent({ 姓名:“研究員”, 角色:“資訊收集者”, goal: '尋找給定主題的相關資訊',});// 建立一個任務 const ResearchTask = new Task({ 描述:“研究人工智慧的最新發展”, agent: ResearchAgent,});// 建立一個團隊const team = new Team({ name: '人工智慧研究團隊', 代理人:[研究代理人], 任務:[研究任務], env: { OPENAI_API_KEY: 'your-api-key-here' },});// 啟動工作流程團隊 。 .then((output) => {console.log('工作流程完成:', output.result); }) .catch((error) => {console.error('工作流程錯誤:', error); });
代理代理是自治實體,旨在執行特定角色並根據分配給他們的任務實現目標。他們就像超級強大的法學碩士,可以循環執行任務,直到得出最終答案。
任務任務定義每個代理程式必須採取的特定操作、其預期輸出,並將關鍵輸出標記為可交付成果(如果它們是最終產品)。
團隊團隊協調代理商及其任務。它從初始輸入開始並管理任務之間的資訊流。
觀看此影片以了解有關這些概念的更多資訊:KaibanJS 概念
看板是即時展示團隊工作流程的優秀工具,為每個成員的進度提供清晰的互動式快照。
我們已將這一概念應用於人工智慧代理。
現在,您可以將 AI 代理的工作流程視覺化為團隊成員,任務就在您眼前從「待辦事項」移動到「已完成」。這種視覺表示簡化了複雜的人工智慧操作的理解和管理,使任何人、任何地方都可以使用它。
透過配置 AI 代理來發揮專業化的力量,使其在專案中的獨特關鍵功能中表現出色。這種方法提高了每項任務的有效性和效率,超越了通用人工智慧的限制。
在此範例中,我們的軟體開發團隊由三個專門的 AI 代理程式提供支援:Dave、Ella 和 Quinn。每個代理商都根據其特定角色進行專業定制,確保高效的任務處理和協同作用,從而加快開發週期。
從 'kaibanjs' 導入 { Agent };const daveLoper = new Agent({ 姓名:“戴夫·洛珀”, 角色:“開發人員”, 目標:“編寫和審查程式碼”, 背景: '有 JavaScript、React 和 Node.js 經驗',});const ella = new Agent({ 名稱:“艾拉”, 角色:“產品經理”, 目標:“定義產品願景並管理路線圖”, 背景: '精通市場分析和產品策略',});const quinn = new Agent({ 名稱:“奎因”, 角色:“品質檢查專家”, 目標:“確保品質和一致性”, 背景:“測試、自動化和錯誤追蹤專家”,});
就像專業人員使用特定工具來出色地完成任務一樣,您的 AI 代理程式也可以利用搜尋引擎、計算器等工具以更高的精度和效率執行專門的任務。
在此範例中,人工智慧代理之一 Peter Atlas 利用 Tavily 搜尋結果工具來增強他選擇最佳旅行城市的能力。該工具允許 Peter 考慮天氣、價格和季節性來分析旅行數據,確保提供最合適的建議。
從 'kaibanjs' 導入 { Agent, Tool };const tavilySearchResults = new Tool({ name: '塔維利搜尋結果', 最大結果: 1, apiKey: 'ENV_TRAVILY_API_KEY',});const peterAtlas = 新代理程式({ 名稱:“彼得·阿特拉斯”, 角色:“城市選擇器”, 目標:“根據綜合旅行數據選擇最佳城市”, 背景:“具有地理數據分析和旅遊趨勢經驗”, 工具:[tailySearchResults],});
KaibanJS 支援所有與 LangchainJS 相容的工具,提供了一種通用的工具整合方法。有關更多詳細信息,請訪問文件。
透過整合一系列專門的 AI 模型來優化您的 AI 解決方案,每個模型都經過量身定制,以在專案的不同方面表現出色。
在此範例中,代理程式(Emma、Lucas 和 Mia)使用不同的 AI 模型來處理功能規格開發的特定階段。這種有針對性地使用人工智慧模型不僅可以最大限度地提高效率,還可以確保每項任務都與最具成本效益和最合適的人工智慧資源保持一致。
從 'kaibanjs' 導入 { Agent };const emma = new Agent({ 姓名:“艾瑪”, 角色:“初步起草”, 目標:“概述核心功能”, llmConfig: {provider: 'google',型號: 'gemini-1.5-pro', },});const 盧卡斯 = 新代理人({ 名稱:“盧卡斯”, 角色:“技術規格”, 目標:“起草詳細的技術規格”, llmConfig: {provider: 'anthropic',型號: 'claude-3-5-sonnet-20240620', },});const mia = 新代理({ 姓名:“米婭”, 角色:“最終審查”, 目標:“確保最終文件的準確性和完整性”, llmConfig: {provider: 'openai',型號: 'gpt-4o', },});
有關將各種 AI 型號與 KaibanJS 整合的更多詳細信息,請訪問文件。
KaibanJS 採用受 Redux 啟發的架構,支援採用統一的方法來管理應用程式中的 AI 代理、任務和整體流程的狀態。此方法可確保在複雜的代理互動中進行一致的狀態管理,從而提供增強的清晰度和控制。
以下是一個簡化的範例,示範如何在 React 應用程式中將 KaibanJS 與狀態管理整合:
從 './agenticTeam' 導入 myAgentsTeam;const KaibanJSComponent = () => { const useTeamStore = myAgentsTeam.useStore(); const { 代理,工作流程結果 } = useTeamStore((state) => ({代理:state.agents,workflowResult:state.workflowResult, })); return (<div> <button onClick={myAgentsTeam.start}>啟動團隊工作流程</button> <p>工作流程結果:{workflowResult}</p> <div><h2>♂️ 代理</h2> {agents .map((agent) => ( <p key={agent.id}>{agent.name} - {agent.role} - 狀態:({agent.status}) </p>))} < /div ></div> );};導出預設的 KaibanJSComponent;
若要更深入地了解 KaibanJS 的狀態管理,請造訪文件。
輕鬆將 AI 功能新增到您的 NextJS、React、Vue、Angular 和 Node.js 專案中。
KaibanJS 旨在實現跨各種 JavaScript 環境的無縫整合。無論您是在 React、Vue 或 Angular 中增強用戶介面,使用 NextJS 建立可擴展的應用程序,還是在 Node.js 中實現伺服器端解決方案,該框架都能順利整合到您現有的工作流程中。
從'react'導入React;從'./agenticTeam'導入myAgentsTeam;const TaskStatusComponent = () => { const useTeamStore = myAgentsTeam.useStore(); const { 任務 } = useTeamStore((state) => ({任務: state.tasks.map((task) => ({ id: 任務.id, 描述: 任務.描述, 狀態: 任務.狀態,})) , })); return (<div> <h1>任務狀態</h1> <ul>{tasks.map((task) => ( <li key={task.id}>{task.description}: 狀態 - {task.status } </li>))} </ul></div> );};導出預設的TaskStatusComponent;
如需更深入的了解,請造訪文件。
內建於 KaibanJS 中的可觀察性功能可讓您透過詳細的統計資料和日誌來追蹤每個狀態變化,從而確保完全的透明度和控制。此功能提供對代幣使用、營運成本和狀態變化的即時洞察,增強系統可靠性並透過全面的資料可見性實現明智的決策。
以下程式碼片段示範如何利用狀態管理方法來監視工作流程日誌中的變更並做出反應,從而提供對 AI 代理程式的操作動態的精細控制和深入洞察:
const useStore = myAgentsTeam.useStore();useStore.subscribe( (狀態)=>狀態.workflowLogs, (newLogs, previousLogs) => {if (newLogs.length > previousLogs.length) { const { 任務、代理、元資料 } = newLogs[newLogs.length - 1]; if (newLogs[newLogs.length - 1].logType === 'TaskStatusUpdate') {switch (task.status) { case TASK_STATUS_enum.DONE:console.log('任務已完成', { taskDescription: task.description, agentName : agent.name,agentModel:agent.llmConfig.model,持續時間:metadata.duration,llmUsageStats:metadata.llmUsageStats,costDetails:metadata.costDetails,});break; case TASK_STATUS_enum.DOING:case TASK_STATUS_enum.BLOCKED:case TASK_STATUS_enum.REVISE:case TASK_STATUS_enum.TODO:console.log('任務狀態更新',{taskDescription:task.description,task. );休息; default:console.warn('遇到意外的任務狀態:', task.status);break;} }} });
有關如何利用 KaibanJS 中的可觀察性功能的更多詳細信息,請訪問文件。
官方文檔
加入我們的不和諧
KaibanJS 旨在相容於 React、Vue、Angular 和 NextJS 等主要前端框架,使其成為開發人員的多功能選擇。 JavaScript 生態系統「有點複雜…」。如果您有任何問題,請告訴我們,我們將協助您解決問題。
全球約有 2,000 萬名 JavaScript 開發人員,但大多數 AI 框架最初都是用 Python 寫的。其他的只是 JavaScript 的改編。
這使得我們所有JavaScript 開發人員在人工智慧競賽中處於劣勢。但現在不再了...
KaibanJS 旨在提供專為 JavaScript 生態系統設計的強大且易於使用的 AI 多代理框架,從而改變遊戲規則。
const writeBy = `另一個不想學習 Python 來做有意義的 AI 東西的 JS 開發人員。
加入 Discord 社區,與其他開發人員聯繫並獲得支援。在 Twitter 上關注我們以獲取最新動態。
我們歡迎社區的貢獻。請在提交拉取請求之前閱讀貢獻指南。
KaibanJS 已獲得 MIT 許可。