CoT Reasoning Map

Claude의 추론 과정에서 배우세요. Claude Code용 MCP App (SEP-1865)으로, extended thinking 트레이스를 대화형 추론 맵으로 바꿔 줍니다. 추론 맵은 유형화된 이동(프레이밍, 가설, 검증, 백트래킹, 자기 수정, 통찰, 행동, 결론)을 의존성 에지와 폐기 에지가 있는 그래프로 배치하고, 노력 타임라인, 재생 모드, 원문 그대로의 CoT 발췌문으로의 클릭 이동을 제공합니다.

API 키가 필요 없습니다. 이미 실행 중인 Claude 세션이 어노테이션을 수행하기 때문입니다.

작동 방식

1. list_sessions — thinking 블록이 포함된 최근 Claude Code 트랜스크립트(~/.claude/projects/**/*.jsonl)를 찾습니다.

2. get_thinking — 세션에서 번호가 매겨진 thinking 블록과 도구 호출 스켈레톤을 추출합니다.

3. 호출한 Claude가 thinking을 원문 그대로의 발췌문이 포함된 유형화된 이동으로 어노테이션합니다.

4. show_reasoning_map — 이동을 대화형 위젯으로 렌더링하여 채팅에 인라인으로 표시합니다 (Claude Code 데스크톱 앱 / claude.ai; 터미널 CLI에서는 텍스트 폴백).

이렇게 말해 보세요: "내 마지막 세션의 추론을 맵으로 보여 줘" 또는 "데모 추론 맵을 보여 줘" (인자 없이 호출하면 샘플 데이터를 렌더링합니다).

Related MCP server: Sequential Thinking MVP Server

설치

Node 18+가 필요합니다.

git clone https://github.com/matanma12/cot-widget-spike.git
cd cot-widget-spike
npm install && npm run build
claude mcp add cot-spike --scope user -- node "$(pwd)/server.js"

Claude Code를 다시 시작하고 추론 맵을 요청하세요.

개발

• server.js — MCP 서버(stdio; Streamable HTTP는 :3001에서 npm run serve:http)

• mcp-app.html + src/mcp-app.js — 위젯(@modelcontextprotocol/ext-apps의 App)

• npm run build — dist/mcp-app.html로 번들링합니다(vite-plugin-singlefile)

• node test-client.js — stdio를 통한 프로토콜 스모크 테스트

상태 / 로드맵

구현 완료: 수집, 호스트 모델 어노테이션 루프, 그래프 + 타임라인 + 재생 + 발췌문, Claude Code 데스크톱에서의 인라인 렌더링 검증 완료. 다음: hooks를 통한 라이브 세션 추적, 트레이스 전반의 패턴 라이브러리, 다음 이동 예측 재생, claude.ai 배포.

MIT 라이선스입니다.