mcpField
C
codebase-navigator

codebase-navigator

github.com/srbhr開発28.9k44 回インストール6 日前に更新
リポジトリ

codebase-navigator について

codebase-navigatorは、開発者がコードを探し、プロジェクト構成を把握するためのスキルです。検索・トレース用スクリプトと、アーキテクチャや主要ファイルの案内を備えています。

主な機能

  1. 01関数、コンポーネント、エンドポイントの検索
  2. 02APIとデータフローの追跡
  3. 03シンボルの使用箇所と依存関係の検索
  4. 04アーキテクチャと主要ファイルの参照

活用シーン

  1. 01関数やコンポーネントの定義場所を特定
  2. 02機能の呼び出しやデータフローを追跡

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/srbhr/resume-matcher --skill codebase-navigator

インストール後、Claude Code で/codebase-navigatorを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

references/
REFERENCE.md
scripts/
search.sh
trace.sh

詳細

コードベースナビゲーター

コードの調査、ファイルの検索、プロジェクト構造の把握では、まずこのスキルを使用してください。

クイックスタート

検索スクリプト(推奨)

よく使う検索には、同梱のスクリプトを実行してください。

# Find functions/methods
.agents/skills/codebase-navigator/scripts/search.sh functions <pattern>

# Find React components
.agents/skills/codebase-navigator/scripts/search.sh components <pattern>

# Find API endpoints
.agents/skills/codebase-navigator/scripts/search.sh endpoints

# Trace an API flow end-to-end
.agents/skills/codebase-navigator/scripts/trace.sh api-flow <endpoint>

# Trace a data field from backend to UI
.agents/skills/codebase-navigator/scripts/trace.sh data-flow <field_name>

# Find component hierarchy
.agents/skills/codebase-navigator/scripts/trace.sh component-tree <ComponentName>
ripgrep の直接パターン
# Find any symbol
rg --no-heading -n '\bMySymbol\b' apps/

# Python function definitions
rg --no-heading -n '(def|async def) my_function' apps/backend/ --type py

# React component usage
rg --no-heading -n '<MyComponent' apps/frontend/ --glob '*.tsx'

# Pydantic models
rg --no-heading -n 'class My.*BaseModel' apps/backend/ --type py

# API route handlers
rg --no-heading -n '@(router|app)\.(get|post|put|patch|delete)' apps/backend/ --type py

アーキテクチャの概要

必要な情報ドキュメント
バックエンドアーキテクチャdocs/agent/architecture/backend-architecture.md
フロントエンドアーキテクチャdocs/agent/architecture/frontend-architecture.md
API コントラクトdocs/agent/apis/front-end-apis.md
API フローマップdocs/agent/apis/api-flow-maps.md
ドキュメントの全インデックスdocs/agent/README.md

プロジェクトのレイアウト

apps/
├── backend/app/
│   ├── main.py              # FastAPI entry, CORS, routers
│   ├── config.py            # Pydantic settings from env
│   ├── database.py          # TinyDB wrapper
│   ├── llm.py               # LiteLLM wrapper
│   ├── routers/             # API endpoints
│   ├── services/            # Business logic
│   ├── schemas/             # Pydantic models
│   └── prompts/             # LLM prompt templates
│
└── frontend/
    ├── app/                 # Next.js pages
    ├── components/          # UI components
    ├── lib/                 # API client, utilities, i18n
    ├── hooks/               # Custom React hooks
    └── messages/            # i18n translations (en, es, zh, ja)

よくあるワークフロー

「X はどこで定義されていますか?」
.agents/skills/codebase-navigator/scripts/search.sh functions my_function
.agents/skills/codebase-navigator/scripts/search.sh components MyComponent
.agents/skills/codebase-navigator/scripts/search.sh classes MyClass
.agents/skills/codebase-navigator/scripts/search.sh types MyType
「X を呼び出しているのは何ですか?」
.agents/skills/codebase-navigator/scripts/search.sh usage my_function
.agents/skills/codebase-navigator/scripts/search.sh deps my_file.py
「機能 X のデータはどのように流れますか?」
.agents/skills/codebase-navigator/scripts/trace.sh api-flow resumes
.agents/skills/codebase-navigator/scripts/trace.sh data-flow personalInfo
.agents/skills/codebase-navigator/scripts/trace.sh component-tree ResumeEditor

主要なエントリーポイント

対象ファイル
バックエンドの起動apps/backend/app/main.py
フロントエンドのページapps/frontend/app/
API クライアントapps/frontend/lib/api.ts または lib/api-client.ts
デザイントークンapps/frontend/app/globals.css
履歴書のスキーマapps/backend/app/schemas/
LLM プロンプトapps/backend/app/prompts/

参考資料

ripgrep のチートシートと高度な検索パターンについては、references/REFERENCE.md を参照してください。

コメント