이 요약은 AI가 원문을 분석해 생성했습니다. 정확한 내용은 원문 기준으로 확인하세요.
핵심 요약
Claude Code의 로컬 세션 데이터를 분석하여 비용, 토큰, 도구 호출 내역을 시각화하는 React 기반 로컬 대시보드 프로젝트이다.
배경
Claude Code 사용 시 발생하는 비용과 도구 호출 내역에 대한 가시성을 확보하기 위해 로컬 세션 파일을 시각화하는 대시보드를 개발하여 공유했다.
의미 / 영향
이 프로젝트는 Claude Code와 같은 CLI 기반 AI 에이전트의 사용 투명성을 높이는 실무적인 방법을 제시했다. 로컬 로그 파일을 직접 활용하는 방식은 데이터 보안을 유지하면서도 정교한 비용 관리와 성능 최적화가 가능함을 입증했다.
커뮤니티 반응
사용자는 자신이 만든 도구를 GitHub에 공개했으며, 커뮤니티의 질문과 기능 제안을 환영하고 있다.
합의점 vs 논쟁점
합의점
- Claude Code의 로컬 세션 로그가 ~/.claude/ 디렉토리에 저장된다는 사실
- 로컬 대시보드를 통해 비용 및 도구 호출 가시성을 높일 수 있다는 점
실용적 조언
- Claude Code 사용량이 많다면 로컬 대시보드를 구축하여 캐시 적중률과 비용을 모니터링하라.
- ~/.claude/ 디렉토리의 JSONL 파일을 직접 분석하여 커스텀 통계를 생성할 수 있다.
언급된 도구
Claude Code추천
AI 코딩 에이전트 및 CLI 도구
React추천
대시보드 프론트엔드 구축
Express추천
로컬 세션 파일 처리를 위한 API 서버
섹션별 상세
Claude Code 사용 시 발생하는 비용과 도구 호출 내역에 대한 가시성을 확보하기 위해 로컬 대시보드를 개발했다. 사용자는 ~/.claude/ 경로에 저장되는 JSONL 형식의 세션 로그 파일을 직접 파싱하여 데이터를 추출한다. 이를 통해 어떤 작업에서 토큰 소모가 큰지, 어떤 파일이 가장 많이 수정되었는지 실시간으로 파악할 수 있다. 로컬 데이터를 활용하므로 보안 위협 없이 사용 패턴을 분석할 수 있다는 점이 핵심이다.
대시보드는 세션별 예상 비용과 30일간의 일일 비용 추이를 차트로 시각화한다. 사용자는 Bash, Grep, Read, Write 등 Claude Code가 실행하는 다양한 도구 호출의 빈도를 확인하여 에이전트의 동작 방식을 심층적으로 이해할 수 있다. 특히 캐시 적중률(Cache hit rate) 지표를 제공하여 컨텍스트 재사용이 얼마나 효율적으로 이루어지는지 수치로 보여준다. 이는 프롬프트 캐싱 전략을 최적화하여 비용을 절감하는 근거가 된다.
기술 스택은 Express API와 React를 사용하여 로컬 환경에서 구동되도록 설계되었다. 모든 데이터 처리가 로컬 머신 내에서 완결되므로 외부 서비스로의 데이터 유출 걱정이 없다. 전체 대화 기록 뷰어 기능을 통해 특정 프롬프트에 대응하는 도구의 입력과 출력을 상세히 추적할 수 있다. 사용자는 GitHub 저장소를 통해 코드를 확인하고 자신의 환경에 즉시 적용할 수 있다.
실무 Takeaway
- Claude Code의 로컬 JSONL 세션 파일을 활용하면 외부 API 호출 없이도 상세한 사용 통계를 추출할 수 있다.
- 대시보드를 통해 세션별 비용, 도구 호출 빈도, 캐시 적중률을 모니터링하여 Claude Code 사용 패턴을 최적화할 수 있다.
- Express와 React를 이용한 로컬 호스팅 구조로 데이터 프라이버시를 유지하면서 사용량 가시성을 확보했다.
언급된 리소스
AI 분석 전체 내용 보기
AI 요약 · 북마크 · 개인 피드 설정 — 무료
출처 · 인용 안내
원문 발행 2026. 03. 28.수집 2026. 03. 28.출처 타입 REDDIT
인용 시 "요약 출처: AI Trends (aitrends.kr)"를 표기하고, 사실 확인은 원문 보기 기준으로 진행해 주세요. 자세한 기준은 운영 정책을 참고해 주세요.