Claude Code의 스킬과 에이전트를 한눈에 관리하는 터미널 UI 'ccview' 공개

실용적 조언

Claude Code의 스킬이나 에이전트 현황을 파악하기 어렵다면 ccview를 설치하여 한눈에 확인 가능하다.
터미널 UI 도구를 직접 제작할 때 Bun과 Ink 조합을 사용하면 웹 개발 경험을 활용해 빠르게 구축할 수 있다.

섹션별 상세

Claude Code 사용자는 스킬, 에이전트, 플러그인 등 다양한 도구를 설치함에 따라 설정 파일이 여러 경로에 분산되는 관리 문제를 겪는다. 스킬은 ~/.claude/skills/, 에이전트는 ~/.claude/agents/, 규칙은 CLAUDE.md에 각각 저장되어 전체 구성을 한눈에 파악하기 어렵다. 작성자는 이러한 파편화된 정보를 중앙에서 관리하기 위해 파일 시스템 기반의 통합 뷰어를 고안했다. 이를 통해 사용자는 복잡한 경로를 직접 탐색하지 않고도 현재 활성화된 모든 도구를 즉시 확인할 수 있다.

ccview는 현대적인 개발 스택인 Bun과 Ink를 활용하여 터미널 UI(TUI)를 구축했다. Bun 런타임은 빠른 시작 속도와 기본 TypeScript 지원을 제공하며, Ink는 React의 컴포넌트 및 상태 관리 패턴을 터미널 렌더링에 적용한다. 마크다운 파일의 메타데이터를 추출하기 위해 gray-matter 라이브러리를 사용하여 스킬과 에이전트 파일의 프론트매터를 정확하게 파싱한다. 웹 개발의 익숙한 패턴을 터미널 도구 제작에 도입하여 유지보수성과 확장성을 확보했다.

데이터 통합 방식은 별도의 데이터베이스 없이 로컬 파일 시스템을 직접 스캔하는 방식을 채택했다. 프로그램 실행 시 전역 설정 경로와 현재 프로젝트의 .claude/ 폴더를 동시에 읽어 들여 데이터를 병합한다. 병합된 각 항목에는 [global] 또는 [project] 태그가 자동으로 부여되어 사용자가 설정의 적용 범위를 명확히 인지하도록 돕는다. 파일 시스템을 진실의 근원(Source of Truth)으로 삼아 별도의 동기화 과정 없이 실시간 상태를 반영한다.

용어 해설

터미널 사용자 인터페이스(Terminal UI): — 텍스트 기반의 터미널 환경에서 그래픽 인터페이스와 유사한 조작감을 제공하는 기술이다. 명령줄 도구에 컴포넌트, 상태 관리, 레이아웃 개념을 도입하여 복잡한 정보를 시각적으로 구조화한다. 개발자가 여러 설정 파일을 직접 열어보지 않고도 직관적으로 데이터를 확인하고 관리할 수 있게 돕는다.
프론트매터(Frontmatter): — 마크다운 문서의 최상단에 위치하는 YAML 또는 JSON 형식의 메타데이터 블록이다. 파일의 제목, 설명, 태그 등 구조화된 정보를 포함하며 프로그램이 문서를 파싱할 때 핵심 데이터를 추출하는 용도로 쓰인다. Claude Code의 스킬이나 에이전트 설정 파일에서 정보를 읽어오는 데 필수적인 요소이다.
런타임(Runtime): — 프로그래밍 언어가 실행되는 환경을 의미하며, 이 글에서는 JavaScript와 TypeScript를 실행하는 Bun을 지칭한다. 코드의 실행 속도, 패키지 관리, 시스템 자원 접근 방식을 결정하는 기반 소프트웨어이다. 터미널 도구의 경우 초기 구동 속도와 개발 편의성에 직접적인 영향을 미친다.

언급된 도구

ccview추천링크

Claude Code 스킬 및 에이전트 통합 뷰어

Bun추천

빠른 실행 속도를 제공하는 JavaScript/TypeScript 런타임

Ink추천

터미널 UI 구축을 위한 React 기반 라이브러리

언급된 리소스

GitHubccview GitHub Repository