はじめに
Claude CodeやCodexを使っていて、こんな経験ありませんか？
- 「あの時どうやって実装したっけ...？」
- 「前に似たようなバグ直したはずなのに、どのセッションだったか分からない」
- 「AIとの会話で良いアイデアが出たのに、どこに埋もれたか見つからない」
- 「Claude Codeで話したかCodexで話したか覚えてない...」
Claude Codeの会話履歴は ~/.claude/projects/ に、Codexは ~/.codex/sessions/ にJSONL形式で保存されていますが、正直これを直接読むのはかなり辛い...。
そこで作ったのが cc-search です。
cc-searchとは
cc-searchは、Claude CodeとCodexの会話ログを閲覧・横断検索できるWebビューアーです。
ローカルに保存されたセッションファイルを読み取り、ブラウザで快適に閲覧・検索できます。
起動はワンコマンド
npx @nogataka/cc-search
これだけでブラウザが開いて、すぐに使い始められます。インストール不要、設定不要。
こんな場面で使えます
「どのプロジェクトで話してたっけ？」
filesystemの話、Claude Codeだったか Codexだったか…。そんなときは検索バーにキーワードを入れるだけ。Claude CodeとCodexの全セッションを横断検索して、マッチした箇所をハイライト表示します。プロジェクトを事前に選ぶ必要はありません。
[ 🔍 filesystem ]
[ ソース: Claude Code ✓ Codex ✓ ]
「このプロジェクト内だけ探したい」
特定のプロジェクトに絞って検索することもできます。プロジェクトフィルターで絞り込めば、ノイズなく目的の会話が見つかります。
[ 🔍 エラー handling ]
[ プロジェクト: my-nextjs-app ]
[ ソース: Codex ✓ Claude Code ☐ ]
「昨日の作業の続きを探したい」
期間フィルターを使えば、「昨日」「過去7日」「過去30日」などの範囲で絞り込めます。カレンダーからカスタム範囲を指定することも可能です。
[ 🔍 MCP ]
[ プロジェクト: openweb ]
[ 期間: 過去7日 ]
「あの設計の議論、どこだっけ？」
「なぜその設計にしたか」「どんな選択肢を検討したか」といった設計議論や決定ログも、キーワード検索で素早く見つけ出せます。会話履歴は単なるログではなく、再利用可能なナレッジです。
主な機能
1. 全文検索（横断検索）
これが一番の特徴です。
- Claude Code・Codex横断検索 - ソースをチェックボックスで選択
- プロジェクトフィルター - 特定プロジェクトに絞り込み
- 期間フィルター - プリセット（過去7日/30日/90日/1年）またはカレンダーで範囲指定
- マッチ箇所ハイライト - 前後の文脈付きで表示
- ワンクリックジャンプ - 検索結果からセッション詳細へ直接移動
- 最近の検索履歴 - 過去の検索キーワードをワンクリックで再利用
- ページネーション - 大量の結果も快適にブラウズ
2. プロジェクト一覧
- Claude Code / Codex タブ切り替え - 両方のセッションを一箇所で管理
- 検索フィルター - プロジェクト名やパスで絞り込み
- ソート機能 - 最終更新日・プロジェクト名・セッション数でソート
- グリッド / リスト表示 - 好みの表示形式を選択
3. セッション詳細
会話の内容を構造的に表示します。
- 左サイドバー - セッション一覧をワンクリックで切り替え、設定タブ付き
- スティッキーヘッダー - セッションタイトル・プロジェクトパス・コスト情報を常時表示
- ユーザーメッセージ - 自分が送ったメッセージ
- アシスタント応答 - Claudeの回答（Markdown対応）
- ツール使用 - ファイル読み込み、編集、コマンド実行などの詳細
- 思考ブロック - Claudeの思考プロセス（Extended Thinking使用時）
- フローティングボタン - 会話の先頭/末尾へスクロール
- モバイル対応 - レスポンシブデザイン
特にツール使用の詳細が見られるのがポイント。どのファイルを読んで、どう編集したのかが一目で分かります。
4. APIコスト表示（Claude Code）
- トークン使用量 - 入力・出力・キャッシュ別に表示
- USDコスト - セッションごとのAPI利用料金を自動計算
- モデル名 - 使用モデルの表示
設定項目
サイドバーの設定タブ、またはセッション一覧ページから変更できます（Cookieに保存）。
| 設定 | デフォルト | 説明 |
|---|---|---|
| ユーザーメッセージなしを非表示 | ON | 空のセッションを隠す |
| 同一タイトルを統合 | ON | 重複セッションをまとめる |
技術スタック
- Next.js 15 - App Router、Turbopack
- Hono - 軽量APIサーバー + Zodバリデーション
- React 19 - UIライブラリ
- TanStack React Query / Jotai - 状態管理
- Tailwind CSS 4 / Radix UI - スタイリング・UIコンポーネント
- react-markdown - Markdown / コードハイライト対応
- Biome / Vitest - Lint・フォーマット・テスト
インストール方法
npxで実行（推奨）
npx @nogataka/cc-search
グローバルインストール
npm install -g @nogataka/cc-search
cc-search
開発版を試す
git clone https://github.com/nogataka/cc-search.git
cd cc-search
pnpm install
pnpm dev
Node.js 20.12.0 以上が必要です。
対応データ
| ソース | 保存場所 |
|---|---|
| Claude Code | ~/.claude/projects/ |
| Codex | ~/.codex/sessions/ |
どちらもJSONL形式の会話ログを自動で読み込みます（読み取り専用）。
こんな人におすすめ
- Claude CodeやCodexをヘビーに使っているエンジニア
- 過去のAIとの会話から知見を再利用したい人
- 「あの時の設計議論」「あのバグ対応」をすぐ見つけたい人
- APIコストを把握しておきたい人
- Claude CodeとCodexを併用していて、横断検索したい人
まとめ
cc-searchを使えば、Claude CodeやCodexとの会話履歴を横断検索して、過去の知見をすぐに見つけ出せます。
プロジェクト・期間・ソースで絞り込み、マッチ箇所をハイライト表示。会話履歴を「読み返せる資産」に変えましょう。
npx @nogataka/cc-search
GitHub: https://github.com/nogataka/cc-search
IssueやPRも歓迎です。