fetching-library-docs
ReactやNext.js、Prismaなどのライブラリに関するAPIリファレンスやコード例、使い方を効率的に取得し、公式APIの学習や利用方法に関する質問に的確に答えるSkill。
📜 元の英語説明(参考)
Token-efficient library API documentation fetcher using Context7 MCP with 77% token savings. Fetches code examples, API references, and usage patterns for published libraries (React, Next.js, Prisma, etc). Use when users ask "how do I use X library", need code examples, want API syntax, or are learning a framework's official API. Triggers: "Show me React hooks", "Prisma query syntax", "Next.js routing API". NOT for exploring repo internals/source code (use researching-with-deepwiki) or local files.
🇯🇵 日本人クリエイター向け解説
ReactやNext.js、Prismaなどのライブラリに関するAPIリファレンスやコード例、使い方を効率的に取得し、公式APIの学習や利用方法に関する質問に的確に答えるSkill。
※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。
下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o fetching-library-docs.zip https://jpskill.com/download/17301.zip && unzip -o fetching-library-docs.zip && rm fetching-library-docs.zip
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/17301.zip -OutFile "$d\fetching-library-docs.zip"; Expand-Archive "$d\fetching-library-docs.zip" -DestinationPath $d -Force; ri "$d\fetching-library-docs.zip"
完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。
💾 手動でダウンロードしたい(コマンドが難しい人向け)
- 1. 下の青いボタンを押して
fetching-library-docs.zipをダウンロード - 2. ZIPファイルをダブルクリックで解凍 →
fetching-library-docsフォルダができる - 3. そのフォルダを
C:\Users\あなたの名前\.claude\skills\(Win)または~/.claude/skills/(Mac)へ移動 - 4. Claude Code を再起動
⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。
🎯 このSkillでできること
下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。
📦 インストール方法 (3ステップ)
- 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
- 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
- 3. 展開してできたフォルダを、ホームフォルダの
.claude/skills/に置く- · macOS / Linux:
~/.claude/skills/ - · Windows:
%USERPROFILE%\.claude\skills\
- · macOS / Linux:
Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。
詳しい使い方ガイドを見る →- 最終更新
- 2026-05-18
- 取得日時
- 2026-05-18
- 同梱ファイル
- 11
📖 Skill本文(日本語訳)
※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。
Context7 効率的なドキュメント取得ツール
シェルパイプラインを通じて、自動で77%のトークン削減を実現するライブラリドキュメント取得ツールです。
クイックスタート
常にトークン効率の良いシェルパイプラインを使用してください:
# ライブラリの自動解決 + フィルタリング
bash scripts/fetch-docs.sh --library <library-name> --topic <topic>
# 例:
bash scripts/fetch-docs.sh --library react --topic useState
bash scripts/fetch-docs.sh --library nextjs --topic routing
bash scripts/fetch-docs.sh --library prisma --topic queries
結果: 約934トークンではなく、約205トークンを返します(77%削減)。
標準ワークフロー
ドキュメントのリクエストを行う際は、以下のワークフローに従ってください。
1. ライブラリとトピックの特定
ユーザーのクエリから抽出:
- Library: React, Next.js, Prisma, Express など
- Topic: 特定の機能 (hooks, routing, queries など)
2. シェルパイプラインで取得
bash scripts/fetch-docs.sh --library <library> --topic <topic> --verbose
--verbose フラグは、トークン削減の統計情報を表示します。
3. フィルタリングされた出力を使用
スクリプトは自動的に以下を行います:
- 完全なドキュメントを取得 (934トークン、サブプロセス内に保持)
- コード例 + API シグネチャ + 主要な注釈にフィルタリング
- 必須コンテンツのみを Claude に返す (205トークン)
パラメータ
基本的な使い方
bash scripts/fetch-docs.sh [OPTIONS]
必須 (いずれか1つを選択):
--library <name>- ライブラリ名 (例: "react", "nextjs")--library-id <id>- 直接 Context7 ID (より高速、解決をスキップ)
オプション:
--topic <topic>- 焦点を当てる特定の機能--mode <code|info>- コード例の場合はcode(デフォルト)、概念の場合はinfo--page <1-10>- より多くの結果を得るためのページネーション--verbose- トークン削減の統計情報を表示
モードの選択
Code Mode (デフォルト): コード例 + API シグネチャを返します
--mode code
Info Mode: 概念的な説明 + 少数の例を返します
--mode info
一般的なライブラリ ID
より高速な検索のために --library-id を使用してください (解決をスキップ):
React: /reactjs/react.dev
Next.js: /vercel/next.js
Express: /expressjs/express
Prisma: /prisma/docs
MongoDB: /mongodb/docs
Fastify: /fastify/fastify
NestJS: /nestjs/docs
Vue.js: /vuejs/docs
Svelte: /sveltejs/site
ワークフローパターン
パターン 1: クイックコード例
ユーザーの質問: "React useState の例を見せて"
bash scripts/fetch-docs.sh --library react --topic useState --verbose
戻り値: 5つのコード例 + API シグネチャ + 注釈 (~205トークン)
パターン 2: 新しいライブラリの学習
ユーザーの質問: "Prisma を始めるにはどうすればいいですか?"
# ステップ 1: 概要を取得
bash scripts/fetch-docs.sh --library prisma --topic "getting started" --mode info
# ステップ 2: コード例を取得
bash scripts/fetch-docs.sh --library prisma --topic queries --mode code
パターン 3: 特定の機能の検索
ユーザーの質問: "Next.js のルーティングはどのように機能しますか?"
bash scripts/fetch-docs.sh --library-id /vercel/next.js --topic routing
正確な ID がわかっている場合は、--library-id を使用するとより高速です。
パターン 4: 深い探求
ユーザーは包括的な情報を必要としています:
# ページ 1: 基本的な例
bash scripts/fetch-docs.sh --library react --topic hooks --page 1
# ページ 2: 高度なパターン
bash scripts/fetch-docs.sh --library react --topic hooks --page 2
トークン効率
仕組み:
fetch-docs.shはfetch-raw.shを呼び出します (これはmcp-client.pyを使用します)- 完全なレスポンス (934トークン) はサブプロセスのメモリに保持されます
- シェルフィルタ (awk/grep/sed) が必須要素を抽出します (LLMトークンは使用されません)
- フィルタリングされた出力 (205トークン) を Claude に返します
削減量:
- 直接 MCP: クエリあたり 934 トークン
- このアプローチ: クエリあたり 205 トークン
- 77% 削減
mcp-client.py を直接使用しないでください - フィルタリングをバイパスし、トークンを浪費します。
高度な使い方: ライブラリの解決
ライブラリ名が失敗する場合は、バリエーションを試してください:
# さまざまな形式を試す
--library "next.js" # ドット付き
--library "nextjs" # ドットなし
--library "next" # 短縮形
# または手動で検索
bash scripts/fetch-docs.sh --library "your-library" --verbose
# 推奨されるライブラリ ID を出力で確認
検証
実行: python3 scripts/verify.py
期待される結果: ✓ fetch-docs.sh ready
検証が失敗した場合
- 診断を実行:
ls -la scripts/fetch-docs.sh - 確認: スクリプトが存在し、実行可能であること
- 修正:
chmod +x scripts/fetch-docs.sh - それでも失敗する場合は停止して報告してください - ダウンストリームの手順に進まないでください
トラブルシューティング
| 問題 | 解決策 |
|---|---|
| ライブラリが見つからない | 名前を変えてみるか、より広い検索語を使用する |
| 結果がない | --mode info またはより広いトピックを使用する |
| より多くの例が必要 | ページを増やす: --page 2 |
| 完全なコンテキストが必要 | 説明については --mode info を使用する |
| 許可が拒否されました | 実行: chmod +x scripts/*.sh |
参考文献
詳細な Context7 MCP ツールのドキュメントについては、以下を参照してください:
- references/context7-tools.md - 完全なツールリファレンス
実装に関する注記
コンポーネント (参照のみ、fetch-docs.sh を使用):
mcp-client.py- ユニバーサル MCP クライアント (基盤)fetch-raw.sh- MCP ラッパーextract-code-blocks.sh- コード例フィルタ (awk)extract-signatures.sh- API シグネチャフィルタ (awk)extract-notes.sh- 重要な注釈フィルタ (grep)fetch-docs.sh- メインオーケストレーター (常にこれを使用)
アーキテクチャ: シェルパイプラインはサブプロセスでドキュメントを処理し、完全なレスポンスを Claude のコンテキストから除外します。 フィルタリングされた必須要素のみが LLM コンテキストに入り、100% の機能を維持しながら 77% のトークン削減を実現します。
📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開
Context7 Efficient Documentation Fetcher
Fetch library documentation with automatic 77% token reduction via shell pipeline.
Quick Start
Always use the token-efficient shell pipeline:
# Automatic library resolution + filtering
bash scripts/fetch-docs.sh --library <library-name> --topic <topic>
# Examples:
bash scripts/fetch-docs.sh --library react --topic useState
bash scripts/fetch-docs.sh --library nextjs --topic routing
bash scripts/fetch-docs.sh --library prisma --topic queries
Result: Returns ~205 tokens instead of ~934 tokens (77% savings).
Standard Workflow
For any documentation request, follow this workflow:
1. Identify Library and Topic
Extract from user query:
- Library: React, Next.js, Prisma, Express, etc.
- Topic: Specific feature (hooks, routing, queries, etc.)
2. Fetch with Shell Pipeline
bash scripts/fetch-docs.sh --library <library> --topic <topic> --verbose
The --verbose flag shows token savings statistics.
3. Use Filtered Output
The script automatically:
- Fetches full documentation (934 tokens, stays in subprocess)
- Filters to code examples + API signatures + key notes
- Returns only essential content (205 tokens to Claude)
Parameters
Basic Usage
bash scripts/fetch-docs.sh [OPTIONS]
Required (pick one):
--library <name>- Library name (e.g., "react", "nextjs")--library-id <id>- Direct Context7 ID (faster, skips resolution)
Optional:
--topic <topic>- Specific feature to focus on--mode <code|info>- code for examples (default), info for concepts--page <1-10>- Pagination for more results--verbose- Show token savings statistics
Mode Selection
Code Mode (default): Returns code examples + API signatures
--mode code
Info Mode: Returns conceptual explanations + fewer examples
--mode info
Common Library IDs
Use --library-id for faster lookup (skips resolution):
React: /reactjs/react.dev
Next.js: /vercel/next.js
Express: /expressjs/express
Prisma: /prisma/docs
MongoDB: /mongodb/docs
Fastify: /fastify/fastify
NestJS: /nestjs/docs
Vue.js: /vuejs/docs
Svelte: /sveltejs/site
Workflow Patterns
Pattern 1: Quick Code Examples
User asks: "Show me React useState examples"
bash scripts/fetch-docs.sh --library react --topic useState --verbose
Returns: 5 code examples + API signatures + notes (~205 tokens)
Pattern 2: Learning New Library
User asks: "How do I get started with Prisma?"
# Step 1: Get overview
bash scripts/fetch-docs.sh --library prisma --topic "getting started" --mode info
# Step 2: Get code examples
bash scripts/fetch-docs.sh --library prisma --topic queries --mode code
Pattern 3: Specific Feature Lookup
User asks: "How does Next.js routing work?"
bash scripts/fetch-docs.sh --library-id /vercel/next.js --topic routing
Using --library-id is faster when you know the exact ID.
Pattern 4: Deep Exploration
User needs comprehensive information:
# Page 1: Basic examples
bash scripts/fetch-docs.sh --library react --topic hooks --page 1
# Page 2: Advanced patterns
bash scripts/fetch-docs.sh --library react --topic hooks --page 2
Token Efficiency
How it works:
fetch-docs.shcallsfetch-raw.sh(which usesmcp-client.py)- Full response (934 tokens) stays in subprocess memory
- Shell filters (awk/grep/sed) extract essentials (0 LLM tokens used)
- Returns filtered output (205 tokens) to Claude
Savings:
- Direct MCP: 934 tokens per query
- This approach: 205 tokens per query
- 77% reduction
Do NOT use mcp-client.py directly - it bypasses filtering and wastes tokens.
Advanced: Library Resolution
If library name fails, try variations:
# Try different formats
--library "next.js" # with dot
--library "nextjs" # without dot
--library "next" # short form
# Or search manually
bash scripts/fetch-docs.sh --library "your-library" --verbose
# Check output for suggested library IDs
Verification
Run: python3 scripts/verify.py
Expected: ✓ fetch-docs.sh ready
If Verification Fails
- Run diagnostic:
ls -la scripts/fetch-docs.sh - Check: Script exists and is executable
- Fix:
chmod +x scripts/fetch-docs.sh - Stop and report if still failing - do not proceed with downstream steps
Troubleshooting
| Issue | Solution |
|---|---|
| Library not found | Try name variations or use broader search term |
| No results | Use --mode info or broader topic |
| Need more examples | Increase page: --page 2 |
| Want full context | Use --mode info for explanations |
| Permission denied | Run: chmod +x scripts/*.sh |
References
For detailed Context7 MCP tool documentation, see:
- references/context7-tools.md - Complete tool reference
Implementation Notes
Components (for reference only, use fetch-docs.sh):
mcp-client.py- Universal MCP client (foundation)fetch-raw.sh- MCP wrapperextract-code-blocks.sh- Code example filter (awk)extract-signatures.sh- API signature filter (awk)extract-notes.sh- Important notes filter (grep)fetch-docs.sh- Main orchestrator (ALWAYS USE THIS)
Architecture: Shell pipeline processes documentation in subprocess, keeping full response out of Claude's context. Only filtered essentials enter the LLM context, achieving 77% token savings with 100% functionality preserved.
同梱ファイル
※ ZIPに含まれるファイル一覧。`SKILL.md` 本体に加え、参考資料・サンプル・スクリプトが入っている場合があります。
- 📄 SKILL.md (6,491 bytes)
- 📎 references/context7-tools.md (8,305 bytes)
- 📎 scripts/extract-code-blocks.sh (999 bytes)
- 📎 scripts/extract-notes.sh (380 bytes)
- 📎 scripts/extract-signatures.sh (808 bytes)
- 📎 scripts/fetch-docs.sh (5,847 bytes)
- 📎 scripts/fetch-raw.sh (759 bytes)
- 📎 scripts/mcp-client.py (17,263 bytes)
- 📎 scripts/start-server.sh (643 bytes)
- 📎 scripts/stop-server.sh (703 bytes)
- 📎 scripts/verify.py (709 bytes)