BlackBeltTechnology/pi-agent-dashboard

PI Dashboard – 빠른 개요

설명: 여러 pi 코딩 에이전트 인스턴스(Bad Logic의 오픈 소스 AI 기반 코드 어시스턴트 pi)를 실행, 관찰 및 상호 작용할 수 있는 웹 기반 제어판입니다. 이 대시보드는 Node.js 서버(또는 Electron 데스크톱 앱)로 실행되며, 단일 브라우저 탭에서 새 에이전트를 생성하고, 실시간 추론을 확인하며, OpenSpec 변경 사항을 첨부하고, 비용을 관리할 수 있습니다.

주요 기능

• 실시간 세션 미러링 – 활성 상태인 모든 pi 세션이 UI에 즉시 나타나며, 실시간 스트리밍 채팅, 토큰 사용량, 모델 정보 및 진행률 게이지를 제공합니다.
• 양방향 상호 작용 – 브라우저에서 직접 프롬프트를 보내거나, 도구 명령을 실행하거나, ask_user 대화 상자에 응답할 수 있습니다.
• 워크스페이스 구성 – 세션은 폴더/브랜치별로 그룹화되며 드래그 앤 드롭으로 재정렬할 수 있습니다.
• 통합 터미널 및 diff 뷰어 – 브라우저 내 터미널(xterm.js + node-pty)과 파일 변경 사항을 위한 나란히 보기(side-by-side) diff 도구를 제공합니다.
• OpenSpec 및 flow 통합 – 동일한 UI에서 사양 변경 사항을 탐색하고, pi-flow를 실행하며, 흐름 그래프를 볼 수 있습니다.
• 공급자 관리 – Anthropic, OpenAI, Gemini 등의 API 키를 추가할 수 있으며, 사용자 지정 LLM 엔드포인트가 지원되어 즉시 적용됩니다.
• 확장 시스템 – 플러그인을 통해 React 코드를 작성하지 않고도 슬래시 명령으로 트리거되는 모달 UI를 노출할 수 있습니다.
• 네트워킹 – 자동 mDNS 검색, 선택적 Zrok 공용 터널, Claude Desktop과 같은 외부 클라이언트를 위한 MCP 엔드포인트(POST /mcp)를 제공합니다.
• 모바일 친화적 – 터치 대상과 스와이프 서랍이 포함된 반응형 레이아웃입니다.

설치 방법

1. Electron 앱 – GitHub Releases 페이지에서 미리 빌드된 설치 프로그램(macOS, Linux, Windows)을 다운로드합니다. Node.js나 터미널이 필요 없으며, 마법사가 ~/.pi-dashboard/에 pi와 대시보드를 설정합니다.
2. npm 패키지 – npm i -g @blackbelt-technology/pi-agent-dashboard를 실행한 후 pi-dashboard를 실행합니다(또는 pi install npm:@blackbelt-technology/pi-agent-dashboard). http://localhost:8000에서 열립니다.
3. 소스에서 설치 – 리포지토리를 복제하고 corepack enable로 pnpm을 활성화한 후 pnpm install && pnpm run build를 실행하고 pi install …로 설치합니다.
4. Docker – docker 폴더에서 docker compose up -d --build를 실행하면 전체 스택(서버, pi 에이전트, code-server, Zrok, tmux)이 컨테이너 내에서 실행됩니다.

일반적인 워크플로우

• 대시보드(데스크톱 앱 또는 브라우저)를 실행합니다.
• Settings 창을 사용하여 LLM 공급자 키를 추가합니다.
• New Session을 클릭하여 폴더/브랜치와 실행 전략(헤드리스 또는 tmux)을 선택합니다.
• 에이전트의 추론 스트림을 실시간으로 지켜보고 나타나는 ask_user 프롬프트에 응답합니다.
• 사이드바에서 OpenSpec 변경 사항을 첨부하거나 pi-flow를 실행합니다.
• 완료되면 세션을 중지(소프트 중단 → 강제 종료)하거나 완료될 때까지 기다린 후 로그를 내보냅니다.

대상 사용자

• 이미 pi 코딩 에이전트를 사용 중이며 여러 에이전트를 시각적으로 관리하려는 개발자.
• 토큰 비용을 모니터링하거나, 프로젝트별로 세션을 구성하거나, Zrok을 통해 원격 협업자에게 대시보드를 노출해야 하는 팀.
• 사용자 지정 모달 대화 상자로 UI를 확장하려는 플러그인 작성자.

추가 정보

• 데모 사이트: https://blackbelttechnology.github.io/pi-agent-dashboard
• Discord 커뮤니티: https://discord.gg/uQsJgsejb
• 설치, 구성, 확장 기능 작성 및 문제 해결을 다루는 전체 문서는 리포지토리의 (docs/ 폴더)에 있습니다.

---

결론: PI Dashboard는 여러 pi AI 코딩 에이전트를 오케스트레이션하기 위한 실무용 UI로, 실시간 모니터링, 세션 제어 및 확장성을 제공하며, 단일 브라우저 탭이나 패키지화된 Electron 앱을 통해 액세스할 수 있습니다.