🛠️ 開発・MCP コミュニティ

common-pitfalls

Orchestrates pitfall prevention skills for common development issues. Auto-triggered during code review to check for TanStack Query, Drizzle ORM, Express API, React, WebSocket, blockchain RPC, and security pitfalls.

⚡ おすすめ: コマンド1行でインストール(60秒)

下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。ダウンロード → 解凍 → 配置まで全自動。

🍎 Mac / 🐧 Linux

mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o common-pitfalls.zip https://jpskill.com/download/17434.zip && unzip -o common-pitfalls.zip && rm common-pitfalls.zip

🪟 Windows (PowerShell)

$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/17434.zip -OutFile "$d\common-pitfalls.zip"; Expand-Archive "$d\common-pitfalls.zip" -DestinationPath $d -Force; ri "$d\common-pitfalls.zip"

完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。

💾 手動でダウンロードしたい(コマンドが難しい人向け)

1. 下の青いボタンを押して common-pitfalls.zip をダウンロード
2. ZIPファイルをダブルクリックで解凍 → common-pitfalls フォルダができる
3. そのフォルダを C:\Users\あなたの名前\.claude\skills\(Win)または ~/.claude/skills/(Mac)へ移動
4. Claude Code を再起動

⬇ .zip でダウンロード(推奨) ⬇ .skill 形式(上級者用) 元のソース ↗

⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。

🎯 このSkillでできること

下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。

📦 インストール方法 (3ステップ)

1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
3. 展開してできたフォルダを、ホームフォルダの .claude/skills/ に置く
- · macOS / Linux: ~/.claude/skills/
- · Windows: %USERPROFILE%\.claude\skills\

Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。

詳しい使い方ガイドを見る →

最終更新: 2026-05-18
取得日時: 2026-05-18
同梱ファイル: 1

📖 Skill本文(日本語訳)

※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。

よくある落とし穴の防止

本番環境での問題から学習した、専門的な落とし穴防止スキルを連携させます。コードレビュー中に使用して、よくある間違いを自動的にチェックします。

どのような時に使うか

コードレビュー中（full-review スキルによって自動的にトリガーされます）
変更をコミットする前
本番環境の問題をデバッグするとき
見慣れないコードパターンをレビューするとき

ワークフロー

ステップ 1: コードのカテゴリを特定する

変更されたファイルに基づいて、どのサブスキルを呼び出すかを決定します。

ファイルパターン	サブスキル
`/hooks/`, `useQuery`, `useMutation`	pitfalls-tanstack-query
`/db/`, `schema.ts`, `drizzle`	pitfalls-drizzle-orm
`/routes/`, `router.`, `app.`	pitfalls-express-api
`/components/`, `/pages/`, `.tsx`	pitfalls-react
`websocket`, `wss`, `ws.`	pitfalls-websocket
`contract`, `rpc`, `multicall`, `gas`	pitfalls-blockchain
`session`, `key`, `cache`, `log`	pitfalls-security

ステップ 2: 関連するサブスキルを呼び出す

見つかったカテゴリごとに、詳細なパターンに対応するスキルを呼び出します。

ステップ 3: 統合レポートを生成する

呼び出されたすべてのサブスキルからの結果を集約します。

サブスキルリファレンス

スキル	注力分野
pitfalls-tanstack-query	クエリキー、無効化、v5 パターン
pitfalls-drizzle-orm	スキーマ型、マイグレーション、配列カラム
pitfalls-express-api	ルート、ステータスコード、ストレージパターン
pitfalls-react	コンポーネント、フォーム、a11y、レスポンシブ
pitfalls-websocket	サーバー設定、ハートビート、再接続
pitfalls-blockchain	RPC エラー、gas、multicall、nonce
pitfalls-security	セッションキー、キャッシュ、ロギング、シークレット

クイックリファレンスチェックリスト

コア

[ ] TanStack Query のキーは完全な URL パスを使用している
[ ] Mutation は関連するクエリを無効化する
[ ] Drizzle の型はすべてのモデルに対してエクスポートされている
[ ] API ルートは正しいステータスコードを返す
[ ] すべての RPC 呼び出しは try/catch でラップされている
[ ] WebSocket はハートビート/再接続を持っている
[ ] React コンポーネントはローディング/エラー状態を処理する
[ ] ログまたはフロントエンドコードにシークレットがない

型安全

[ ] any 型がない - unknown を使用して絞り込む
[ ] スキーマから推論される型 ($inferSelect, z.infer)
[ ] ランタイム検証のための型ガード

財務

[ ] すべてのトークン量に BigInt を使用する
[ ] 価格計算に Decimal.js を使用する
[ ] 適切な丸め処理 (floor/ceil)

ブロックチェーン

[ ] バッファ付きの Gas 推定
[ ] EIP-1559 ガス価格設定
[ ] 送信前のトランザクションシミュレーション
[ ] Multicall は allowFailure: true を使用する

セキュリティ

[ ] セッションキーには有効期限と制限がある
[ ] 保存されたクレデンシャルには AES-256-GCM を使用する
[ ] 重要な操作の監査ログ
[ ] 指数バックオフによるレート制限

📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開

Common Pitfalls Prevention

Orchestrates specialized pitfall prevention skills learned from production issues. Use during code review to automatically check for common mistakes.

When to Use

During code review (auto-triggered by full-review skill)
Before committing changes
When debugging production issues
Reviewing unfamiliar code patterns

Workflow

Step 1: Identify Code Categories

Based on changed files, determine which sub-skills to invoke:

File Pattern	Sub-Skill
`/hooks/`, `useQuery`, `useMutation`	pitfalls-tanstack-query
`/db/`, `schema.ts`, `drizzle`	pitfalls-drizzle-orm
`/routes/`, `router.`, `app.`	pitfalls-express-api
`/components/`, `/pages/`, `.tsx`	pitfalls-react
`websocket`, `wss`, `ws.`	pitfalls-websocket
`contract`, `rpc`, `multicall`, `gas`	pitfalls-blockchain
`session`, `key`, `cache`, `log`	pitfalls-security

Step 2: Invoke Relevant Sub-Skills

For each category found, invoke the corresponding skill for detailed patterns.

Step 3: Generate Combined Report

Aggregate findings from all invoked sub-skills.

Sub-Skills Reference

Skill	Focus Area
pitfalls-tanstack-query	Query keys, invalidation, v5 patterns
pitfalls-drizzle-orm	Schema types, migrations, array columns
pitfalls-express-api	Routes, status codes, storage patterns
pitfalls-react	Components, forms, a11y, responsive
pitfalls-websocket	Server setup, heartbeat, reconnection
pitfalls-blockchain	RPC errors, gas, multicall, nonces
pitfalls-security	Session keys, caching, logging, secrets

Quick Reference Checklist

Core

[ ] TanStack Query keys use full URL paths
[ ] Mutations invalidate relevant queries
[ ] Drizzle types exported for all models
[ ] API routes return correct status codes
[ ] All RPC calls wrapped in try/catch
[ ] WebSocket has heartbeat/reconnection
[ ] React components handle loading/error states
[ ] No secrets in logs or frontend code

Type Safety

[ ] No any types - use unknown and narrow
[ ] Types inferred from schema ($inferSelect, z.infer)
[ ] Type guards for runtime validation

Financial

[ ] BigInt for all token amounts
[ ] Decimal.js for price calculations
[ ] Proper rounding (floor/ceil)

Blockchain

[ ] Gas estimation with buffer
[ ] EIP-1559 gas pricing
[ ] Transaction simulation before send
[ ] Multicall uses allowFailure: true

Security

[ ] Session keys have expiry and limits
[ ] AES-256-GCM for stored credentials
[ ] Audit logging for sensitive operations
[ ] Rate limiting with exponential backoff