실시간 대시보드: 클로드 코드 에이전트 팀용

클로드 코드 에이전트를 위한 실시간 관측 가능성 대시보드.

다중 에이전트 세션을 위한 강력한 필터링, 검색 및 시각화를 포함합니다.

claude code 플러그인으로 설치:

# 마켓플레이스에 이 저장소를 추가
claude plugin marketplace add simple10/agents-observe
# 플러그인 설치
...

기본 대시보드 URL: http://localhost:4981

호스트에 도커 또는 노드가 설치되지 않은 경우, 플러그인은 제대로 로드하지 못합니다.

설치 문제를 해결하고 수정하기 위해 /observe debug 클로드 명령어를 사용하세요.

기술	설명
/observe
대시보드 URL 열기 및 서버 실행 여부 확인
/observe status
서버 건강 상태, 버전, 런타임 및 설정 세부 정보 표시
/observe start
서버 시작
/observe stop
서버 중지
/observe restart
서버 재시작
/observe logs
최근 도커 컨테이너 로그 표시
/observe debug
서버 문제 진단 (건강 상태, 도커 로그, mcp.log, cli.log)

클로드 코드가 자율적으로 실행될 때 — 하위 에이전트를 생성하고, 도구를 호출하며, 파일을 읽으며, 명령을 실행할 때 — 실제로 일어나고 있는 일에 대한 가시성이 없습니다. 터미널은 활동의 일부만 보여줍니다. 하위 에이전트는 보이지 않습니다. 도구 호출이 뒤섞입니다. 그리고 병렬 실행 중 3 단계 깊이에 문제가 발생했을 때, 당신은 후속 로그를 읽어야 합니다.

Claude Observe는 모든 훅 이벤트를 실시간으로 캡처하고 라이브 대시보드에 스트리밍합니다. 각 에이전트가 무엇을 하는지, 어떤 도구를 호출하는지, 어떤 파일을 만지고 있는지, 하위 에이전트가 부모와 어떻게 관련되는지를 정확히 볼 수 있습니다. 실시간으로.

이것이 중요한 이유는:

**다중 에이전트 작업은 불투명합니다.**조정자는 코드 리뷰어, 테스트 실행기, 문서화 에이전트를 병렬로 생성합니다. 관측 가능성 없이는 최종 결과만 보입니다. 이를 통해 각 에이전트의 작업을 관찰하고 문제가 발생하자마자 파악할 수 있습니다.**도구 호출이 진실입니다.**보조사의 텍스트 출력은 요약입니다. 실제 도구 호출 — bash 명령어, 파일 읽기/편집, grep 패턴 — 은 클로드가 실제로 무엇을 하는지 알려줍니다. Claude Observe는 이를 보여줍니다.**디버깅은 시간 여행입니다.**하위 에이전트가 잘못된 편집을 하거나 파괴적인 명령을 실행할 때, 정확한 이벤트 시퀀스를 따라야 합니다. 이벤트 스트림은 완전한 페이로드를 갖춘 타임라인을 제공합니다.**세션은 일시적이지만 패턴은 아닙니다.**세션을 가로질러 이벤트를 캡처함으로써 에이전트의 시간 경과에 따른 행동, 선호 도구, 그리고 어디에서 멈추는지 볼 수 있습니다.

• 발생 시 도구 호출 스트리밍 (PreToolUse → PostToolUse 및 결과)
• 완전한 에이전트 계층 구조 보기 — 어떤 하위 에이전트가 어떤 부모에 의해 생성되었는지
• 에이전트, 도구 유형으로 필터링 또는 모든 이벤트 검색
• 이벤트 확장하여 전체 페이로드, 명령어, 결과를 보기
• 타임라인 아이콘 클릭하여 스트림의 특정 이벤트로 이동
• 인간 가독성 이름 (예: "twinkly-hugging-dragon") 을 가진 역사적 세션 탐색

클로드 코드 훅 → observe_cli.mjs → API 서버 (SQLite) → 리액트 대시보드
(agent-lib 빌드) (HTTP POST) (파싱 + 저장) (WebSocket 라이브)

observe_cli.mjs

표준 입력에서 원본 이벤트를 읽고 에이전트 클래스별 라이브 (hooks/scripts/lib/agents/<class>.mjs) 로 디스패치합니다. buildHookEvent() 는 메타.isNotification 및 meta.clearsNotification 와 같은 에이전트 클래스 인식 플래그를 포함하는 엔벨로프를 구성한 후 서버에 POST 합니다. 서버는 저장된 상태에 해당 플래그를 기계적으로 적용합니다 (예: pending_notification_ts). 개발 또는 플러그인 없이 실행할 경우. 위의 플러그인을 설치했다면 이 섹션을 건너뜁니다.

git clone https://github.com/simple10/agents-observe.git agents-observe
cd agents-observe
# 필요시만 설치
...

추가 명령어를 위해 justfile 을 참조하세요.

.claude/settings.json 에서 훅을 복사하여 프로젝트의 설정에 넣으세요. 이 저장소에서 목표 프로젝트의 클로드 코드 설정으로:

프로젝트 수준(권장): .claude/settings.json 프로젝트 루트
사용자 수준(모든 프로젝트): ~/.claude/