Use Cases
バグに遭遇した時の動き方: 観察→再現→切り分け→記録→報告のランブック
不具合に当たったとき、何から手をつけるか。観察・再現・切り分け・記録・報告の順に動くランブックを、Claude Codeに渡せる形で具体例とコード付きで紹介。
Claude Codeを使いこなす
Tips, Tutorials & Real-World Use Cases
Terminal
$ claude "Fix the bug in auth.ts"
> Analyzing auth.ts... Found the issue. Fixing now.|
✓ Bug fixed in 3.2 seconds
最新の記事
Use Cases
ObsidianのvaultをCLAUDE.mdにつなぐ3つの方法｜symlink・同期スクリプト・部分抽出
Obsidianに書いた設計メモをClaude Codeに毎回貼り直す手間を消す。symlink・同期スクリプト・必要箇所だけ抽出する3つのつなぎ方を、Windows対応のコード付きで比較します。
Use Cases
Claude Code 権限はデプロイ前のどこで点検する? CIで機械的に止めるゲート設計
Claude Codeの権限点検は「いつ」やるかで事故率が変わる。デプロイ前のゲートをCIに組み込み、危険な操作を機械的に止める手順を、コピペで動く設定つきで紹介します。
Getting Started
CLAUDE.md×権限の実用レシピ｜毎回の説明と危険な編集をそのまま貼って減らす
Claude Codeの「毎回同じ説明」「危険な編集」「検証漏れ」「勝手にコミット」を痛点別に解決。CLAUDE.md記述とsettings.jsonをコピペできる権限設定例で並べます。
Use Cases
無料PDFでメールリストを増やす導線の作り方｜登録率とチェックリスト公開
無料PDF（リードマグネット）で集客しメールリストから有料教材へつなぐ導線を、claudecode-lab.comでの登録数・登録率の実数とコピペできるフォローメール込みで解説。
Tips & Tricks
Claude Codeにビルド→スモークテスト→自動修正を回させる足場の作り方
最小スモークテストの選び方、失敗ログを食わせて直させるループ、回数上限と確認ゲートで暴走を止める方法を、コピペで動くコード付きで紹介します。
Getting Started
新しいリポジトリに入った最初の20分でやる初回点検チェックリスト
初めてのリポジトリで真っ先に見るのは秘密情報・依存の脆弱性・lint/CI・権限・危険スクリプト・ドキュメントの6点。コピペで動く一括点検コマンド付き。
Use Cases
Obsidianのデイリーノートを「Claude Codeの記憶」に変える毎日の運用術
Obsidianに書いた決定事項・ハマり・規約を、毎朝Claude CodeのCLAUDE.mdへ流す日々のワークフロー。何をメモし、どう抜き出し、いつ棚卸しするかを実例で解説。
Tips & Tricks
Claude Code 権限の“はしご”：厳しめから安全に allow を広げる5段
最初は ask/deny 多めで始め、検証が積み上がった操作だけ段階的に allow へ。Claude Code の権限を安全に緩める5段ラダーと、各段の昇格条件を実例で。
Getting Started
Claude Code 軽量ハーネス：型チェック＋テスト＋確認だけ回す最小ループ
個人開発や小さなWebサイトに本格ハーネスは過剰。型チェック・テスト・公開確認の3つだけ回す軽量ハーネスを、コピペで動くシェルスクリプト付きで紹介します。
Use Cases
Claude Code Revenue CTA Routing: 記事からPDF、Gumroad、相談へ送る設計
PVだけで終わらせず、読者の状態に合わせて無料PDF、Gumroad教材、導入相談へ分岐するCTA設計です。
Tips & Tricks
Claude Code Small PR Proof Pack: 小さなPRをレビュー可能にする証拠セット
Claude Codeの小さなPRに、差分・検証・公開URL・CTA・rollbackを添える実務チェックリスト。
Advanced
Claude Codeの『誰が何を許可したか』を残す権限レシート術
Claude Codeで広げた許可を作業ごとに記録するpermission receipt。許可範囲・承認待ち・検証コマンドを残し、事故の説明責任を1分で果たす方法を実例で解説。
Getting Started
Claude Codeで他人のリポジトリを最初の30分で地図化する手順
初見のリポジトリにいきなり修正を頼むと事故る。Claude Codeで編集禁止のまま入口・危険領域・最初の小タスクを洗い出す、僕の30分repo map術を実例つきで。
Tips & Tricks
Claude Codeのコミット前レビューゲート: 壊れた差分を止める5分の型
commit前にClaude Codeで差分・テスト・CTAを一気に点検する型。build失敗、未翻訳本文、壊れたGumroadリンクを公開前に止める実践手順。
Getting Started
Claude Codeへの依頼文は4ブロックで書く: 前提・成果物・制約・確認
Claude Codeに1つの作業を頼むとき、前提・成果物・制約・確認の4ブロックで依頼文を書くと差分が暴れない。コピペできるブリーフ付き。
Use Cases
開発の引き継ぎメモ、型を決めるだけで事故が消えた：4項目ハンドオフ術
やったこと・残り・つまずき・次の一手の4項目で書く開発引き継ぎメモのテンプレ。次の人もClaude Codeもすぐ動ける状態の残し方と、CLAUDE.mdとの使い分けを実例で。
Tips & Tricks
Claude Codeの「できました」を信じない: 検証レシートで証拠を残す運用
AIの自己申告は鵜呑みにしない。テスト・コマンド出力・スクショで裏取りし、検証レシートとしてPRに残す手順を、コピペで動くコード付きで紹介します。
Use Cases
Claude Codeでコンテンツ導線を監査する: PVで終わらせず商品・研修・相談へつなぐ
PVだけで終わらせず、記事から商品・研修・相談へつなぐClaude Code向けコンテンツ導線監査ガイド。
Getting Started
他人が書いた巨大コードベースをClaude Codeで地図化する手順
引き継いだ大規模リポジトリの全体像を、入口・依存・危険領域の順でClaude Codeに地図化させる手順。どこから読むか迷わなくなる実践メモ。
Tips & Tricks
Claude Codeの権限と予算を毎朝回す: 5分で点検するpermission budget loop
Claude Codeのallow/deny、コスト上限、実行ログを毎朝5分で点検する実践ループ。
Use Cases
ビルドが通らない時の切り分け順: 型・依存・設定・環境差を15分で詰める
ビルドエラーで「直して」と全文を貼る前に。型／依存／設定／環境差を疑う順番、最小再現の作り方、Claude Codeに渡して直す反復の回し方を、僕の事故込みで。
Getting Started
Claude Code 権限チェックリスト: settings.jsonの点検22項目
Claude Codeのallow/deny、危険な許可、Hooks、シークレット露出、sandboxまで、settings.jsonで点検すべき項目をチェックリスト化。コピペ監査スクリプト付き。
Tips & Tricks
効いたプロンプトを使い捨てない：保存・命名・チーム共有とカスタムコマンド化
よく効いたClaude Codeのプロンプトを、保存・命名・チーム共有し、CLAUDE.mdやカスタムコマンドに育てる運用術。陳腐化したプロンプトの棚卸しまで、僕の失敗込みでまとめました。
Tips & Tricks
CLAUDE.mdの雛形をコピペで作る｜最初の30行に何を書くか
Claude Codeの最初のCLAUDE.mdに何を書くか迷う人へ。コピペで使える最小テンプレ、言語別の例、毎セッション説明し直す手間を1枚で減らす育て方を、僕の失敗込みでまとめました。
Getting Started
Claude Code最初の30分チェックリスト：初心者が安全に始める手順
Claude Code最初の30分で安全に成果を出すチェックリスト。境界設定、実例、失敗例、検証まで解説。
Use Cases
Claude Codeレビュー運用チェックリスト: PR公開前に失敗を潰す実践手順
Claude Codeレビューを浅い感想で終わらせず、PR公開前にリスク・検証・CTAを潰す実践チェックリスト。
Tips & Tricks
バグ報告テンプレートの書き方: 「直して」が伝わるissueの型をコピペで
「画面が壊れてる」が伝わらないのは情報不足が原因。タイトル・再現手順・期待と実際・環境・ログの並べ方を、コピペで使えるissueテンプレと自動生成スクリプトで整えます。
Getting Started
Claude Code最初の1タスクRunbook: 失敗しない依頼・確認・commit前レビュー
Claude Codeの最初の1タスクを安全に進めるRunbook。依頼文、確認、git diffレビュー、引き継ぎまで解説。
Use Cases
Claude Codeセッション引き継ぎテンプレート: 次の人とAIエージェントに文脈を残す方法
Claude Codeの作業文脈、検証結果、次の一手を失わない引き継ぎテンプレートと実例。
Tips & Tricks
CLAUDE.mdに何を書く？ そのまま貼れるテンプレ7本と禁止事項の作り方
個人開発・コンテンツサイト・API・チーム・レガシー向けのCLAUDE.mdテンプレを、僕が事故った話つきで7本まとめました。コピペして禁止事項を3行足すだけ。
Tips & Tricks
Claude Code を毎日安全に回す：承認とsandboxの線引き運用術
allow/ask/denyの境界、plan・acceptEdits・auto・bypassPermissionsの使い分け、dangerously-skip-permissionsの是非、sandboxの使いどころを実務目線で。
Advanced
自律エージェントを安全に走らせる足場：Codexの暴走を止める7つのガード
Codexのような自律AIに作業を任せて事故らないために。サンドボックス、権限の最小化、出力の検証、破壊的操作のガード、秘密の保護を、コピペで動く設定と僕の失敗談で。
Use Cases
ブログを毎日1本出し続ける公開前チェックリスト：誤字・文字化け・重複を止める
毎日更新が止まる原因は書く速さじゃなく公開前の確認。僕がclaudecode-lab.comで誤字・文字化け・コード不動・重複公開を弾いている運用チェックリストを、コピペで動くスクリプト付きで公開します。
Getting Started
Claude Codeに既存コードで最初に投げるプロンプト集｜コピペで使える7文
他人が書いた既存リポジトリにClaude Codeを入れた初日に、僕が実際に投げるプロンプトを7つ。この構成を説明して/呼び出し元は/影響範囲は、をコピペで。
Getting Started
Claude Codeを入れた最初の30分でやったこと（とやらかしたこと）
Claude Codeをインストールした直後の30分を、僕の実体験で時系列に再現。最初のプロンプト、小さなタスク1個、信頼の作り方まで。最初にやらかした失敗も正直に書きました。
Use Cases
Codex Automationsでコンテンツ運用を毎日回す：Claude Codeとの分担
OpenAI Codexの自動化でアクセス確認・記事QA・公開チェックを毎日回す手順。Claude Codeとの使い分け、コピペで動く品質ゲート、つまずきどころまで僕の実例で。
Use Cases
Cloud Functions の使い方：gcloud functions deploy と Cloud Run の違いを実例で
GCP Cloud Functions の使い方を実例で。HTTP/イベントトリガー、2nd gen と Cloud Run の違い、gcloud functions deploy、Secret Manager を、動くコード付きで解説。
Use Cases
Firestoreは「保存する形」ではなく「読む形」で設計する：非正規化とサブコレクションの決め方
FirestoreのコレクションをSQL感覚で作ると必ず詰まる。読み取りクエリ起点のデータモデル、非正規化とサブコレクションの判断、複合インデックスと料金、セキュリティルールの落とし穴を実体験で解説。
Use Cases
Cloud Run入門：gcloud run deployでコンテナを公開し、0までスケールさせる
ExpressのDockerイメージをCloud Runへ。PORT待受の必須ルール、gcloud run deployの手順、0スケールと料金、Cloud Buildでの自動ビルドを、コピペで動くコード付きで説明します。
Use Cases
API Gatewayの使い方：HTTP APIとREST APIの選び方とLambda統合・認証・CORSをSAMで作る
API Gatewayの使い方を実例で。HTTP APIとREST APIの違い、Lambdaプロキシ統合、Cognito/JWT認証、CORS、ステージ、スロットリングをコピペで動くSAMテンプレートで解説。
Use Cases
Claude CodeをAmazon Bedrockで動かす：環境変数・モデルID・社内統制の設定手順
CLAUDE_CODE_USE_BEDROCKでClaude CodeをBedrockバックエンドに切り替える手順。AWS認証、モデルアクセス申請、リージョンとモデルID、IAM、コスト管理を社内統制目線でまとめた。
Use Cases
CloudWatch Logs Insightsとアラーム設計：障害を5分で絞る運用術
CloudWatchのログ・メトリクス・アラームを「検索できるが判断できない」状態から抜け出す設計。Logs Insightsクエリ、しきい値・複合アラーム、Lambdaログ、保持期間のコストまで実例で解説。
Use Cases
CodePipeline×CodeBuildにClaude Codeで自動テストを組むAWSネイティブCI/CD
buildspec.ymlの実例、CodeBuildの環境変数とIAM最小権限、デプロイ失敗の切り分けを実体験で解説。Claude CodeでAWSネイティブなCI/CDを安全に組む手順。
Use Cases
ECS/Fargateのタスク定義・スケール・コストでハマらない設計術
Fargateのタスク定義、オートスケール、Spot、料金の落とし穴をMasaの失敗込みで解説。Claude Codeに実装させるコツも紹介。
Use Cases
AWS CDK入門：CloudFormationとの違いと、Claude Codeで差分を読む手順
AWS CDK(TypeScript)とCloudFormation(YAML)の違いと使い分けを、synth→diff→deployの実例で解説。ドリフト検知とスタック分割、Claude Codeでの差分レビューまで。
Use Cases
AWS IAMポリシーの書き方と最小権限の作り方：Effect/Action/Resourceとロール入門
IAMポリシーのJSON構造（Effect/Action/Resource/Condition）と最小権限の設計、ロールとAssumeRoleの仕組み、広すぎる「*」など定番の落とし穴を、コピペで動く例つきで解説。
Use Cases
DynamoDBはアクセスパターンから設計する：シングルテーブルとGSIの決め方
RDB思考のままDynamoDBを設計すると必ず詰まる。アクセスパターン起点のシングルテーブル設計、PK/SKとGSIの決め方、コスト判断をClaude Codeと一緒に進める手順。
Tips & Tricks
Claude Code入門：インストールから最初のコミットまで30分
Claude Codeの始め方を初心者向けに。インストール、ブラウザ認証、最初のプロンプト、最初のコミットまでを30分で。僕が最初につまずいた権限・コンテキスト・CLAUDE.mdの落とし穴も紹介。
Tips & Tricks
REST API入門：初めての最小APIをClaude Codeと60分で動かす
REST API入門。HTTPメソッドとステータスコードの基礎から、Claude CodeでTodo APIをCRUDまで作り、curlとテストで動かす最初の一歩を実体験で解説。
Use Cases
Claude Code × AWS S3入門: 最小権限でsync・画像アップロード・署名付きURLを作る
Claude CodeでAWS S3を安全に使う入門。IAM最小権限、aws s3 sync、静的サイト、画像、バックアップ、署名付きURLまで実装。
Tips & Tricks
REST API設計でURLとステータスコードを先に決める：エンドポイント命名と冪等性
REST APIのURL設計・HTTPメソッドとステータスコードの使い分け・ページング・バージョニング・冪等性を、実装前に決める手順とコピペで動くコードで。
Tips & Tricks
Claude Code vs Gemini CLI、結局どっち？僕の使い分け基準
Claude CodeとGemini CLIを半年併用した僕の使い分け基準。料金・OSS・Google連携・失敗例から、あなたが選ぶべき方を整理します。
Comparison
Claude Code と Devin、どっちに任せる？相棒型と自律型の使い分け
手元で伴走するClaude Codeと、クラウドで放置できる自律型Devin。性格・得意な場面・料金の考え方・併用を、僕の運用目線で整理しました。
Tips & Tricks
Claude Code vs Cursor 2026: 実務タスク別に選ぶ比較ガイド
Claude CodeとCursorを実務タスク別に比較。既存repo、Reactリファクタ、CI修正、非エンジニア運用まで整理。
Tips & Tricks
Claude Code 速度最適化ガイド: 遅い原因を切り分けて実務を速くする
Claude Codeが遅い原因を/usage、/context、/compact、CLAUDE.mdで切り分け、実務で速くする手順を解説。
Tips & Tricks
LLM APIの料金、なぜ高い？トークン課金の仕組みと予算で止める実装
AI APIの請求が読めない人へ。入出力トークン課金の計算、モデル使い分け、プロンプトキャッシュ、予算アラートで止める方法を、コピペで動くコードと一緒に整理しました。
Use Cases
AWS Lambda実装の勘所：コールドスタートとIAMで詰まらないNode.js設計
Lambda(Node.js/TypeScript)で詰まる定番ポイントを実装目線で解説。ハンドラの書き方、コールドスタート対策、Layers、IAM最小権限、CloudWatchログ、SAMデプロイまでコピペで動くコード付き。
Tips & Tricks
Claude Code に「全部やって」は禁句：暴走を防ぐ安全な指示の書き方
曖昧な一文がClaude Codeの事故を招く。広すぎる削除・本番への適用・秘密の露出を防ぐ依頼文の型、dry-run、権限とフックで機械的に止める設計を実例で。
Tips & Tricks
本番障害の対応手順: 止血→切り分け→復旧→ポストモーテムを崩さない
本番が落ちた瞬間、焦って直すと被害が広がる。検知→止血→原因切り分け→復旧→振り返りの順番を固定し、Claude Codeをログ調査と仮説出しに使う実務手順を、僕のやらかし込みで紹介。
Tips & Tricks
Claude Code 権限設定リファレンス|settings.json の allow/deny/ask 早見表
Claude Code の権限を settings.json で設計するリファレンス。allow/deny/ask の評価順、Bash・Edit・Read・WebFetch のパターン構文、Hooks 自動化をコピペ設定例で。
Tips & Tricks
AIに鍵を握らせる前に。初心者がまず守る“事故らせない”5つの安全対策
Claude Codeに作業を任せる前の超入門。APIキー漏洩・危険コマンドの暴走・本番削除を防ぐ最小設定を、僕の失敗談つきでやさしく解説します。
Tips & Tricks
Claude Code セキュリティ失敗事例7選: 原因・復旧・再発防止
Claude Codeの.env漏洩、本番DB破壊、CI暴走を失敗事例から防ぐ実践ガイド。
Tips & Tricks
ハーネスエンジニアリングとは？AIエージェントの「足場」を作って安全に任せる方法
AIエージェントが暴走しない理由はモデルの賢さではなく「ハーネス（足場）」。とは何か、なぜ要るのか、safePathの門番から検証ループまで、コピペで動く最小例でやさしく解説。
Tips & Tricks
ObsidianとClaude Codeをつなぐ全体像｜知識ベースをAIの相棒に変える入口
散らかったObsidianのメモをClaude Codeの相棒に変える全体像。何が起きるか、つなぎ方の地図、毎日の回し方、安全の境界線を、入口の1枚として実体験でまとめます。
Tips & Tricks
Claude CodeでSaaS連携を作る: APIキー、OAuth、Webhook、監査ログまで
Claude CodeでSaaS連携を実装する手順。APIキー、OAuth、Webhook検証、リトライ、監査ログまで実例で解説。
Use Cases
新人エンジニアが最初のPRを出すまで2週間→3日。Claude Code前提のオンボーディング設計
新人が初日に環境を再現し、リポジトリを自力で把握し、安全に最初のPRを出す。README/devcontainer/CLAUDE.md/リポジトリマップで立ち上げを縮める実務手順を、僕の失敗込みで。
Tips & Tricks
「たぶん1日」で爆死した僕の、開発見積もりタスク分解術
「入力欄1つ追加で1日」が5日に膨らんだ反省から、タスク分解・3点見積もり・バッファの置き方を実例で。Claude Codeで前提と抜けを洗い出す壁打ち手順つき。
Tips & Tricks
Claude Codeで始めるシークレット管理: .envから本番ローテーションまで
Claude Codeで.env、CI/CD、クラウド鍵、ログ秘匿を安全に扱う実践ガイド。
Tips & Tricks
Claude Codeにエラーを「直して」と言う前に：原因を当てさせる渡し方
Claude Codeにエラーを丸投げすると一般論が返る。ログの整え方、再現手順の作り方、スタックトレースの読み方を僕の失敗込みで具体的に。
Tips & Tricks
git コンフリクト解決の手順：マーカーの読み方からrerereと再発防止まで
git のマージ衝突を直す具体的な手順。コンフリクトマーカーの読み方、ours/theirsの罠、rerereでの自動再利用、衝突を減らす運用、Claude Codeへの頼み方まで実例で。
Tips & Tricks
レビューで止まるPRを減らす：小さく出して自分で説明する型
AIで速く書いたPRほどレビューで止まる。小さく分け、説明を埋め、自己レビューする型をClaude Codeで仕組み化。コピペで動く差分サイズCI付き。
Use Cases
技術的負債は「大掃除」だと失敗する。Claude Codeで小さく返す型
技術的負債をClaude Codeで棚卸し→ICE/RICEで優先順位→300行のPRで安全に返す型。コピペで動くスキャナと、僕がやらかした失敗込みで紹介。
Use Cases
API設計の進め方をClaude Codeと一緒に：要件→エンドポイント→スキーマ→エラー
Claude Codeを相棒にAPIを設計する進め方。要件の整理からリソースとエンドポイント、入出力スキーマ、エラー設計、命名とステータスコードの一貫性、設計レビューまでを順番に。
Use Cases
テーブル設計で詰む前に。正規化・リレーション・インデックスの判断軸
DB設計の正規化・主キー外部キー・1対多/多対多・インデックスを、SaaSの例とコピペで動くPostgreSQLで解説。NULL多用やEAVの失敗も。
Use Cases
Claude Codeに環境構築を任せて事故らない：再現できる開発環境の作り方
「環境セットアップして」だけだと.envまで読まれる。Claude Codeに任せる範囲を権限・hooks・CLAUDE.mdで先に固める、再現可能な手順を実例で。
Tips & Tricks
Claude Codeで巨大コードベースを読む: 検索術と依存追跡で迷わない手順
10万行のリポジトリで迷子になった僕が使う、rg検索の段階化・依存の追い方・実行経路の追跡まで。読み進め方を具体コマンドで解説。
Tips & Tricks
エラーメッセージの読み方: スタックトレースのどこから読むと原因に最短で着くか
赤いログを上から全部読むのは遠回り。スタックトレースのどこから読むか、undefined・型・非同期・importの型分類、エラーをClaude Codeに渡して原因を絞るコツを実例で。
Advanced
Claude Codeサブエージェント実装ガイド: 記事・コード作業を安全に並列委譲する方法
Claude Codeサブエージェントで記事・コード作業を安全に並列化する実装ガイド。委譲基準、プロンプト、失敗例を解説。
Use Cases
Claude Codeをチームで使うと属人化する。共有すべき4つの置き場所と運用ルール
Claude Codeをチーム導入すると個人技がバラける。CLAUDE.md・権限・カスタムコマンド・規約を全員で共有し、属人化と新人の立ち上がり遅れを防ぐ実務ルールをまとめた。
Tips & Tricks
Claude Codeのトークンを節約する：/clearと/compactの使い分けでコンテキストを軽くする
Claude Codeの会話が重くなり返答が雑になる原因はコンテキスト圧迫。/clearと/compactの使い分け、CLAUDE.mdを短く保つコツ、読ませる量を絞る依頼で、トークンとコストを下げる方法を実例で。
Use Cases
定型業務の自動化: 何を自動化すべきか選び、cron・CIで回す手順
毎日の手作業をどう選び、スクリプト化し、cronやタスクスケジューラ・CIで定期実行するか。Claude Codeにスクリプトを書かせ、通知と失敗時の扱いまで実体験でまとめました。
Advanced
Claude Agent SDKで自作AIエージェント: ツール定義から権限まで実装で学ぶ
Claude Agent SDKで自分専用AIエージェントを作る方法。SDKの位置づけ、ツール定義、エージェントループ、権限設計をコピペで動くTypeScript/Pythonコードで解説。
Tips & Tricks
Claude Code カスタムスラッシュコマンドの作り方: .claude/commands と $ARGUMENTS で自分の型を作る
Claude Codeの自作スラッシュコマンドを最新仕様で。.claude/commands/*.md の書き方、$ARGUMENTS・位置引数、frontmatter、スキル統合、チーム共有まで実例で解説。
Advanced
Claude Codeが急にバカになる原因はコンテキスト管理。/compactと/clearの使い分け
Claude Codeで会話が長くなると精度が落ちるのは机が散らかるから。/context・/compact・/clear・CLAUDE.mdの使い分けを実例で解説。
Tips & Tricks
Claude CodeのCanvas開発でぼやけ・スマホ崩れを直す実装術
Canvasがスマホで崩れぼやける原因はHiDPIと座標設計。Claude Codeに渡す条件文、コピペで動くコード、Playwright検証まで実体験で解説。
Advanced
Claude Codeに任せたリリースで版番号を事故らせないChangesets運用術
Claude Codeでリリースを任せると速い。でも版番号は雑だと事故る。Changesetsで破壊的変更の誤公開を防ぐ運用を、失敗談つきで解説。
Use Cases
CORSエラーが消えない人へ：メッセージ別の直し方とClaude Codeでの安全な設定
「Access-Control-Allow-Originがない」等のCORSエラーをメッセージ別に診断。preflightとcredentialsの罠、Express/Workers実装、curl検証までMasaが解説。
Use Cases
通貨フォーマットで1円ずれる事故を消す：Intl.NumberFormat実装
JPY/USD/EURの金額表示で1円ずれ・丸め事故を消す方法。Intl.NumberFormatと整数保存をClaude Codeで実装。コピペで動くコード付き。
Use Cases
discord.jsでスラッシュコマンドのDiscord Botを作る：登録・3秒ルール・ホスティングまで
discord.jsでスラッシュコマンドのDiscord Botをゼロから作る手順。コマンド登録、Gateway Intents、interaction応答の3秒ルール、トークン管理、ホスティングをコピペコード付きで解説。
Advanced
Claude Code Hooks 実装ガイド：PreToolUseで危険コマンドを止める設定例
Claude Code Hooks の使い方を実装目線で。PreToolUse/PostToolUse/Stop の役割、settings.json 登録、exit code 2 とフックの権限上書きまで、コピペで動く設定例で解説。
Tips & Tricks
Markdownを変換するなら正規表現は捨てる。remark/rehypeで安全に処理する書き方
MarkdownをHTMLに変換するとき正規表現で見出しやリンクを拾うと事故る。remark/rehypeのパイプライン、rehype-sanitizeでXSS対策、目次生成、MDXとの違いを実コードで。
Tips & Tricks
Claude Codeとペアプロ｜AIを相棒にして任せすぎない開発の型
Claude Codeとペアプログラミングする時の役割分担・基本ループ・プロンプト例を、僕の失敗談つきで紹介。任せすぎて事故らないコツがわかる。
Advanced
Claude Codeのプロンプトが効かない時に試す5つの応用テク
「いい感じに直して」でClaude Codeが暴れるのは頼み方のせい。曖昧さを消す・ファイルで文脈を渡す・段階的に検証させる・出力形式を固定する・失敗を立て直す。Before/After付き。
Comparison
Claude Code と GitHub Copilot、結局どっち？用途別の使い分け
Claude CodeとGitHub Copilotを実体験で比較。補完か委譲か、料金、権限、失敗談から、あなたのチームにどちらが合うかを判断できるように整理しました。
Use Cases
Claude CodeでGoを書くと共有mapが壊れる：goroutineとエラー値の任せ方
Claude CodeにGoを任せると共有mapへの並行書き込みやcontext切れが起きがち。goroutine/channel、error値、go test -raceで安全に進める手順を実例で。
Advanced
テストはどこから書く？Claude Codeで決めるテスト戦略の優先順位
テストピラミッドで単体・結合・E2Eの比率を決め、価値の高い所から守る。Claude Codeにテストを書かせる順番、落ちるテストの直し方、テストファーストのコツを実例で。
Use Cases
JavaScriptの日付が1日ずれる原因と、タイムゾーンを壊さない実装
JavaScriptの日付・時刻でハマる原因をタイムゾーン起点で整理。UTCで保存しローカルで表示する型、date-fnsとTemporalの使い分け、夏時間と相対時刻まで、コピペで動くコードで解説。
Advanced
モノレポでClaude Codeが暴走しない設計：pnpm×Turborepoで影響範囲を固定する
モノレポでClaude Codeに「いい感じに直して」は事故のもと。pnpm workspaceとTurborepo affectedで依存と影響範囲を固定し、安全にレビューできる差分にする方法を実例で。
Getting Started
Claude Code料金ガイド2026: Pro/Max/APIの選び方とコスト管理
Claude Codeの料金、API費用、プラン選び、節約ルールを実例と計算コードで解説。
Tips & Tricks
Claude Codeで良いプロンプトを書く5つのコツ｜Before/After付き
「いい感じにして」が通じない理由はモデルじゃなく頼み方。Claude Codeで効く具体性・文脈・出力形式・例示・反復の5コツを、Before/Afterの実例で。
Tips & Tricks
コードレビュー チェックリスト＋Claude Codeで一次レビューを回す方法
正しさ・可読性・セキュリティ・テスト・設計の観点別チェックリストと、CLAUDE.mdに観点を入れてClaude CodeにPRの一次レビューをさせる手順を、僕の失敗込みで紹介します。
Advanced
イベント駆動アーキテクチャとは？pub/sub・Saga・冪等性を動くコードで
「いい感じに疎結合で」で組むと障害時に追えない。イベントとコマンドの違い、pub/sub、結果整合性、Sagaを動くNode.jsコードで整理した設計メモ。
Use Cases
AIに丸ごとリファクタは事故る。Claude Codeで安全に直す段取り
Claude Codeでリファクタリングを安全に進める段取り。テストで挙動を固定→小さく刻む→git diffで確認。広範囲の一括置換で僕がやらかした事故と回避策つき。
Use Cases
Rust入門でcloneだらけになる前に：所有権・借用・Resultの考え方
Rustの所有権・借用・ライフタイムをモノの貸し借りで理解し、Result/Optionでエラーを安全に扱う。コピペで動くCLIと、いつRustを選ぶかの判断軸まで。
Tips & Tricks
Claude CodeでWeb Audio APIを実装する方法: 波形、録音、音量メーター
Claude CodeでWeb Audio APIを使い、波形プレーヤー・録音プレビュー・音量メーターをReact/TypeScriptで実装します。
Use Cases
セキュリティヘッダーの設定: CSP・HSTSを事故らせず段階導入する手順
CSP・HSTS・X-Frame-Options・Referrer-Policy・Permissions-Policyの意味と設定値、Report-Onlyでの段階導入、検証ツールまで。広告や計測を壊さず守りを固める手順。
Use Cases
Recharts・Chart.js・D3の使い分け、迷ったらこの順で選ぶ
Claude Codeでグラフライブラリを選ぶ基準を、Recharts・Chart.js・D3の比較表と判断フローで解説。最初に何を選べば手戻りしないかを実例で。
Use Cases
Claude Codeで個人開発を週末に公開する：副業につなぐ現実手順
Claude Codeで個人開発を加速する手順を、僕の失敗込みで。30分の準備、週末MVP公開、CLAUDE.mdとObsidianで継続、収益化の導線まで。
Advanced
Claude CodeでWebアプリを監査する: 依存脆弱性・シークレット・OWASP観点の手順
Claude Codeで自分のWebアプリを安全に監査する手順。npm auditとDependabotの依存脆弱性、シークレット混入の検知、OWASP Top 10観点のレビューを実例とプロンプトで。
Use Cases
テストがないレガシーコードをClaude Codeで段階置き換えする手順
テストのない古いコードを、特性評価テストで現状を固定し、ストラングラーフィグ・パターンで少しずつ置き換える。Claude Codeで安全に進める実践手順を、動くコードと失敗談つきで。
Use Cases
React脳のままSvelteを書いて事故った僕が掴んだ、Claude Codeでの移行のコツ
React経験者がSvelte 5 runes（$state/$derived/$effect）とSvelteKitルーティングでつまずく所を、Claude Codeで安全に書く頼み方ごと解説。
Advanced
tree shakingでバンドルサイズを削る：sideEffectsとバレルの罠
未使用exportが消えない原因はESMかsideEffectsの設定ミス。仕組み、バレルファイルの罠、esbuildで効果を測る最小コードまで実例で解説。
Getting Started
GitHub ActionsでCI/CD入門：lintからデプロイまで最小構成で通す
CI/CD構築の入門。GitHub Actionsでlint→test→build→deployを1本のYAMLで通す最小手順、トリガー・Secrets・ブランチ保護・失敗時の扱いを、僕の事故込みでやさしく解説。
Use Cases
gRPC入門：Protocol Buffersと4種のストリーミングを動かして理解する
gRPCを.protoの書き方からコード生成、単項・サーバー・クライアント・双方向ストリーミングまで、Nodeで動く最小例で解説。REST/GraphQLとの使い分けも。
Advanced
MCPサーバーの作り方: TypeScript SDKで自作ツールをClaude Codeにつなぐ
MCP(Model Context Protocol)サーバーをTypeScript SDKで自作する手順。tools/resources公開、stdio、claude mcp addでの登録まで動くコード付き。
Use Cases
React脳でVue 3を書いたら事故った話：Composition APIとPiniaの正しい入り方
Reactから来た僕がVue 3でやらかした失敗を出発点に、ref/reactive/computed/watchの使い分け、script setup、Piniaのsetup storeを、コピペで動くコードで解説します。
Use Cases
Claude Codeで安全にWebスクレイピングを実装する実務ガイド
Claude CodeでWebスクレイピングを安全に実装。robots.txt、Fetch、Playwright、監査ログまで解説。
Advanced
バンドルサイズの犯人を特定する：rollup-plugin-visualizerで重い依存を見つける
バンドルが重い原因を可視化で特定する手順。rollup-plugin-visualizerとsource-map-explorerで巨大依存と重複を見つけ、削減前に犯人を名指しする方法を実例で解説。
Tips & Tricks
IndexedDBの使い方：idbライブラリで下書き保存とオフライン同期を作る
ブラウザ内DBのIndexedDBをidbライブラリで簡潔に。localStorageとの違い、オブジェクトストアとインデックス、トランザクション、容量と永続化を動くコードで。
Use Cases
Claude Codeで地図を組み込む：APIキー漏れと課金事故を避けるGoogle Maps実装
「地図を入れて」で済ませると後でキー漏れと課金で痛い目を見ます。店舗検索を例に、APIキー分離・マーカー・料金対策をNext.js実装で解説。
Use Cases
Claude CodeでSanity CMSを本番運用する設計ガイド
Sanity CMSをClaude Codeで実装し、記事運用、商品LP、多言語CMSを収益化につなげる実践ガイド。
Use Cases
サーバーレス関数(FaaS)とは？4大プラットフォームの選び方と落とし穴
サーバーレス関数(FaaS)の仕組みを最短で理解。コールドスタートや状態を持てない制約、AWS Lambda/Cloud Run/Workers/Vercelの選び方を、判断表とコード付きで整理します。
Advanced
Webhook受信で二重課金した僕が辿り着いた、署名検証・冪等性・リトライの実装
Webhook受信エンドポイントを本番で壊さないための実装メモ。raw bodyの扱い、HMAC署名検証、冪等性で重複配信を止める方法、リトライとタイムアウト、ngrokでのローカルデバッグを動くコードで。
Advanced
Claude Codeの「ログ入れて」が本番で死ぬ理由と構造化ログ設計
Claude Codeに任せると増えるconsole.logは障害で役に立たない。構造化ログ・PIIマスク・アラート・可観測性を安全に設計する実装手順を、僕の決済API事故込みで紹介。
Use Cases
OpenAPI入門：openapi.yamlで仕様を書き、Swagger UIで見て、型まで自動生成する
OpenAPIとSwaggerの違いから、openapi.yamlの書き方、Swagger UIでの閲覧、スキーマからのTypeScript型生成、スキーマ駆動開発までを、実際に動くコードで順に解説します。
Advanced
Webパフォーマンス改善はCore Web Vitalsを測ってから直す：LCP/INP/CLSの優先順位
速くした“つもり”で離脱率が下がらない人へ。Core Web Vitals（LCP/INP/CLS）の閾値、web-vitalsでの計測、直す順番を実例コードで整理したハブ記事。
Tips & Tricks
レスポンシブCSS設計の考え方：モバイルファースト・clamp・コンテナクエリで崩さない
横スクロールが消えないのは設計順序のせい。モバイルファースト、clamp、コンテナクエリ、画像の出し分けまで、崩れないレスポンシブCSSの考え方を実例で。
Advanced
CLAUDE.mdは「何を書かないか」で決まる：粒度と更新の原則
長いCLAUDE.mdほど指示が守られない。僕が事故って学んだ、何を書き何を消すか・粒度・更新タイミングの原則を、確認往復を減らす運用視点でまとめました。
Use Cases
オーディオプレーヤーをReactで自作: シーク・音量・プレイリストまで
audio要素とHTMLMediaElementでオーディオプレーヤーを自作。再生・シーク・音量・プレイリスト・アクセシビリティを、コピペで動くReactコード付きで解説します。
Advanced
Webキャッシュ戦略の決め方：Cache-Control・CDN・Redis無効化の実装
古い価格や情報漏えいを防ぐWebキャッシュ戦略を、HTTPヘッダー・CDN・Redis・無効化の順で実装。stale-while-revalidateとキャッシュ削除のコツも。
Advanced
Claude Codeで画像最適化を自動化：WebP変換と遅延読み込みで表示を速くする
数MBの画像をうっかり本番に流した僕が、Claude CodeにWebP/AVIF変換・遅延読み込み・CIサイズ検査を任せて表示を速くした手順を、コピペできるコード付きで解説。
Tips & Tricks
ダークモードの最初の一瞬だけ白い。あのちらつきを消す実装手順
ダークモード実装でほぼ全員がハマる「開いた瞬間だけ白くなる」ちらつき。CSS変数・prefers-color-scheme・head内スクリプトで消す手順を、僕の失敗込みで解説。
Use Cases
ファイルアップロードの進捗バーが嘘をつく問題と、ドラッグ&ドロップ実装の勘所
fetchだと進捗が取れない理由、XHRで本物の進捗バーを出す方法、ドラッグ&ドロップ、失敗時リトライ、presigned URL直アップロードまで、コピペで動くコードで解説します。
Use Cases
Next.js App Routerで境界設計：Server Actionsで事故らないフルスタック開発
Next.js App RouterのServer/Client境界、Server Actions、Route Handler、認証を設計する手順。秘密情報の漏れと不要なuse client追加を防ぐ型をコピペコード付きで解説。
Tips & Tricks
エンジニアじゃなくても効く。職種別「あの作業」をAIに丸投げする方法
営業・サポート・事務・マーケ・ライター。職種ごとの“あるある面倒作業”を、非エンジニアでもコピペで試せるAI活用で1つずつ楽にする実践ガイド。
Use Cases
デザイントークン設計の始め方：CSS変数とStyle Dictionaryでダークモードまで一本化
デザイントークンとは何かを最小例から解説。プリミティブ→セマンティックの設計、CSS変数での実装、Style Dictionaryの多形式出力、ダークモード切替まで僕の失敗込みで。
Tips & Tricks
husky + lint-staged で「壊れたコードをコミットさせない」門番をつくる
コミット前にESLintとPrettierを変更ファイルだけに走らせる仕組みを、husky + lint-stagedで構築。導入手順、commitlint、CIとの二重化、フックが遅い・効かない時の切り分けまで。
Use Cases
成功画面で「購入済み」にして事故った僕のStripe決済実装メモ
Stripe決済を成功ページで確定して権限がズレた話から、Payment Intents・Checkout・Webhook確定・冪等性キー・返金・テストカード検証まで、Claude Codeで安全に組む手順を実コードで。
Advanced
ジョブキューで二重課金を止める：リトライ・冪等性・DLQ実装
「キュー作って」では本番で事故る。BullMQ前提の再試行・冪等性・DLQを、依存なしNode.jsの動くコードで僕が検証した実装メモ。
Use Cases
Claude CodeでSlack Botを作る: 問い合わせ・障害一次対応・日次レポートまで育てる実装手順
Claude CodeとBolt JSでSlack Botを作る手順。Socket Mode、Slash Command、セキュリティまで解説。
Tips & Tricks
Framer Motionの退場・レイアウトアニメ実装：CSSで詰む動きをReactで足す
リストの並び替えやモーダルの退場はCSSだと詰む。Framer Motion(motion)のAnimatePresenceとlayout、Web Animations APIの使い分けを、コピペで動くReactコードで解説。
Use Cases
ResendとReact Emailで作るトランザクションメール実装：登録・通知・再設定を確実に届ける
アプリからのメール送信をResendとReact Emailで実装。登録完了・通知・パスワード再設定の送り分け、配信失敗の再試行、SPF/DKIM/DMARCの触りまで、写して動くコードで解説。
Getting Started
コードが書けなくてもClaude Codeは使える：非エンジニアが資料作成と雑務を安全に任せる始め方
プログラミング未経験でもClaude Codeで資料作成・データ整理・簡単な自動化を頼める。インストールの不安、権限とバックアップ、専門用語の意味、安全な頼み方を一からやさしく。
Use Cases
React開発の基礎を地図にする：コンポーネント設計・フック・状態の置き場で迷わない
Reactでどこにstateを置くか、useEffectをいつ使うか、コンポーネントをどう切るか。設計の判断軸を、コピペで動くコードとClaude Codeでの作り方つきで一本にまとめました。
Tips & Tricks
ドキュメントが嘘をつく前に：JSDoc→TypeDoc自動生成とREADME・ADRの保守
コメントとコードがズレた瞬間ドキュメントは嘘になる。JSDoc/TSDocからTypeDocでリファレンスを生成し、READMEとADRを陳腐化させない仕組みを、Claude Codeと検証スクリプトで回す手順にまとめました。
Advanced
Webフォントで本文がチラつく問題を、font-displayとサブセットで止める
本文が一瞬消える、見出しが後からずれる。FOUT/FOITとCLSの原因をfont-displayの使い分け、日本語フォントのサブセット化、preloadで止めた手順を、コピペできるコード付きで書きました。
Advanced
デザインシステムは「ボタン量産」で死ぬ：コンポーネント設計と運用を小さく育てる
デザインシステムの作り方を、コンポーネントの粒度・命名・バリアント設計、Storybookでの仕様化、チーム運用とガバナンスまで。Claude Codeで小さく育てる実践手順。
Use Cases
Dockerイメージが1.2GB→90MBに激減。マルチステージとalpineで軽くするDockerfileの書き方
巨大なDockerイメージを軽くする実践手順。レイヤーの仕組み、マルチステージビルド、alpine/distrolessの選び方、.dockerignore、キャッシュ活用を、僕が90MBまで削った実例で解説。
Getting Started
Claude Code 始め方：5分で最初の1コマンドを動かすクイックスタート
Claude Codeを5分で動かす最短手順。インストール→ログイン→最初のプロンプトまでを寄り道なしで。網羅版は別記事へ。僕が最初に詰まった3点も先に置きました。
Tips & Tricks
Prettier設定の.prettierrcとESLint競合回避を最短で固める
.prettierrcの書き方、eslint-config-prettierでの競合回避、保存時整形、CIのフォーマットチェックまで、コピペで動く設定で順番に固めます。
Advanced
Redisキャッシュで古い価格が消えない事故を防ぐ：TTL・無効化・stampede対策
Claude CodeにRedisキャッシュを任せると古い価格や情報漏れが起きがち。TTL設計・キー無効化・stampede対策を、僕の事故込みで具体的に解説します。
Tips & Tricks
技術的SEOとAIO最適化のハブ: 構造化データ・Core Web Vitals・内部リンク設計
title/meta、JSON-LD構造化データ、sitemap、Core Web Vitals、内部リンク、AI回答エンジン対策まで。Webサイトを検索とAIに見つけてもらうための土台を、実装つきでまとめます。
Use Cases
Storybookのstoriesの書き方、CSF3で迷わない実践手順
Storybookのstoriesをどう書くか毎回迷う人へ。CSF3、args/controls、autodocs、a11y、interaction test、ビジュアル回帰までコピペで動く形で解説。
Use Cases
動画プレーヤーをReactで自作: 字幕・速度・視聴計測まで実装
講座やメディア向けの動画プレーヤーをClaude Codeで自作。再生制御・字幕・アクセシビリティ・視聴計測まで、コピペで動くReactコード付きで解説します。
Tips & Tricks
ブラウザが固まる重い処理、Web Workerで逃がす（Claude Code実装）
CSV集計や画像処理でUIがカクつく原因と対策。Claude CodeにWeb Workerを型付きで実装させ、メインスレッドを止めない設計を実例コードで解説。
Tips & Tricks
コードレビューの進め方とコメントの書き方：Claude Codeに一次レビューを任せる型
PRを小さく出し、指摘と提案を分け、トゲのないコメントを書く。レビューを溜めないチーム文化と、Claude Codeに一次レビューを任せて人間は設計に集中する運用を、僕の失敗込みで紹介します。
Use Cases
next-intlでWebアプリを多言語化：複数形・通貨・hreflangの実装
Reactアプリのi18nを実装で学ぶ。next-intlのメッセージ管理、複数形・日付・通貨の地域化、言語切替、hreflangとロケール検出まで。10言語運用の経験つき。
Tips & Tricks
Webアクセシビリティ実装の優先順位:セマンティックHTML→キーボード→ARIAの順で直す
a11y対応は「最後にaxe」では遅い。セマンティックHTML優先、ARIAは最後、キーボードとフォーカス、コントラスト、実機確認まで実装順に解説するハブ記事。
Advanced
エラーハンドリング設計: 例外とResult型を境界で使い分けて復旧まで決める
try-catchを増やしても堅くならない。例外とResult型の使い分け、回復可否での分類、境界での集約、ユーザー向け文言と内部ログの分離、リトライをTypeScriptの動くコードで。
Tips & Tricks
npmパッケージ公開でハマる順番に、tsupでESM/CJS両対応する手順
npm publishでESM/CJS両対応のパッケージを公開する手順。package.jsonのexports、tsupビルド、型定義、npm packの中身確認、CI自動公開まで実例で。
Use Cases
Contentful連携で日本語記事が消える事故を、Claude Codeで防ぐ
Claude CodeでContentful（ヘッドレスCMS）をNext.js/Astroに連携。下書きプレビュー・日本語locale・ISR再生成まで、僕がハマった事故と回避策をコード付きで。
Use Cases
DBマイグレーション運用の事故を防ぐ：ゼロダウンタイムで列を入れ替える順番
本番DBの列追加・削除で書き込みを止めない順番を、Prisma MigrateとSQLの実例で。expand→埋め→切替→contractの段階適用とロールバックの限界を僕の事故込みで解説。
Use Cases
E2Eテストとは何を守るテストか - Playwright/Cypress/Selenium選びの基準
E2Eテストの正体を、テストピラミッドの位置から解説。Playwright/Cypress/Seleniumの違い、何をE2Eに任せて何を任せないか、フレーキー対策の考え方まで、僕の失敗談つきで。
Tips & Tricks
eslint.config.js の書き方：Flat ConfigでTypeScriptを実務向けに整える
ESLint v9以降の標準、Flat Config（eslint.config.js）の書き方を実例で。typescript-eslint連携、Prettierとの競合回避、CIでの実行まで僕の失敗込みで解説。
Use Cases
Claude CodeのFirebase開発でデータ流出を防ぐSecurity Rules設計
Claude CodeでFirebase（Auth/Firestore/Functions/Hosting）を実装。他人のデータが読めてしまう事故を防ぐSecurity Rulesとエミュレータ検証を実体験で解説。
Tips & Tricks
Claude CodeのSVGが「ダークモードで真っ黒」になる前に直す型
「SVG作って」だけだと色がハードコードされ、viewBoxが消え、ダークモードで死ぬ。僕が踏んだ罠とコピペで動く型を、アイコン・図解・最適化まで一気にまとめます。
Use Cases
Node.jsでCLIツールを作る: commander引数パースからnpx配布まで
Node.jsのCLIツールを引数パース・対話プロンプト・パイプ対応・色とスピナー・bin/npx配布まで、コピペで動くcommanderのコード付きで手を動かして作る。
Tips & Tricks
Claude CodeでCSSが崩れる原因と、崩れない設計の進め方
Claude CodeでCSSを直すと別ページが崩れる——その原因と直し方を、僕の失敗込みで解説。レイヤー設計で優先順位を固定し、よくある崩れを順に潰す進め方。
Tips & Tricks
Gitブランチ戦略の選び方：trunk-based vs git-flow と rebase/merge使い分け
個人とチームでGitのブランチをどう切るか。trunk-based developmentとgit-flowの違い、rebase/mergeの使い分け、コミット粒度、Claude Code併用の運用を実例で整理。
Use Cases
REST APIをNodeで実装する：ルーティング・入力検証・エラー統一をClaude Codeで
Express 5でREST APIを実装する手順。ルーティング、Zodでの入力検証、エラーレスポンスの統一、認証ミドルウェア、ページネーションをコピペで動くコード付きで解説。
Tips & Tricks
devcontainer.jsonで開発環境を1ファイル化する：Codespacesもチームも同じ箱で動かす
「僕のPCでは動く」を消す方法。devcontainer.jsonの書き方、features、postCreateCommand、Codespacesでの再現、Claude Codeを隔離して安全に走らせるコツを実例で。
Use Cases
画像ギャラリーの難所は遅延読み込みとライトボックス: 自作の勘所
画像ギャラリーで詰まるのは並べ方ではなく遅延読み込みとライトボックス。loading=lazyとIntersectionObserverの使い分け、srcset、拡大表示とキーボード送りまで実装で解説。
Use Cases
Chrome拡張の作り方をManifest V3で。content scriptと権限でつまずかない最短ルート
Chrome拡張をManifest V3で作る手順を実例で。content script・service worker・popupの役割、permissionsの絞り方、ストア公開までコピペで動くコード付き。
Use Cases
Claude CodeのPython開発を2026年版に。uv・ruff・pytestで足場から作る
Claude CodeでPython開発する2026年の型。uvで環境、ruffでlintと整形、pytestでテスト駆動、pyproject.toml一本化まで、コピペで動くコードで解説。
Tips & Tricks
Service Worker入門：キャッシュ戦略3つとオフライン対応、更新の落とし穴
Service Workerのinstall/activate/fetch、cache-first・network-first・stale-while-revalidateの使い分け、Workbox、古いSWが残る更新事故をコピペコードで。
Tips & Tricks
React状態管理は「規模」と「種類」で選ぶ：Zustand・Jotai・Reduxの使い分け
useStateで足りるか、Zustandか、Jotaiか、Reduxか。サーバー状態はそもそも別物。規模と種類でライブラリを選ぶ判断軸を、コピペで動くコードと一緒に整理しました。
Use Cases
Claude CodeでSupabase連携、RLSを忘れて他人のメモが丸見えになった話
Claude CodeにSupabase実装を任せると画面は動くのにRLSが抜ける。Postgres/Auth/Storage/Edge Functionsを事故なく作る順番を実体験で解説。
Use Cases
APIテストをsupertest+Vitestで自動化する。Claude Codeに「200だけ見るな」と言う話
Claude CodeのAPIテストが200 OKしか見ない問題を、supertestとfetch+Vitestで解決。認証込みの検証、契約テスト、テストDBとモック、CI実行まで失敗談つきで。
Use Cases
ログイン機能、JWTで作って大事故。Web認証はセッション・bcrypt・Cookieで固める
Web認証の実装で迷う人へ。セッションとJWTの使い分け、bcryptでのパスワード保存、Cookie属性、CSRF・セッション固定対策を、コピペで動くコードと失敗談つきで整理しました。
Advanced
CSSアニメーションが重い・酔うを直す：transform中心の実装とprefers-reduced-motion対応
@keyframesとtransitionの使い分け、transform/opacityでGPUに乗せる、will-changeの正しい使い方、prefers-reduced-motion対応、スクロール連動まで。動くコード付き。
Use Cases
Claude CodeでTDDを実践する方法: Vitestとnode:testで学ぶテスト駆動開発
Claude CodeでTDDを実践する手順を、Vitestとnode:testの動く例、CI、hooks、依頼テンプレ付きで解説。
Use Cases
Claude APIでチャットボットを実装する：ストリーミングと会話履歴の正解
Claude API（Messages API）でチャットボットを作る手順。ストリーミング応答、会話履歴の持ち方、システムプロンプト、社内文書RAG、コストと落とし穴を実コードで。
Tips & Tricks
Claude CodeでTypeScript開発を速く安全にする実践Tips
strict設定、Zod、Union、型テストでClaude CodeのTypeScript開発を安全に速くする。
Use Cases
Claude Codeでバグを潰す手順: 症状から原因をgit bisectで挟み撃ち
Claude Codeでデバッグする実践手順。スタックトレースの読ませ方、症状から仮説への絞り込み、git bisectとログ戦略、再現手順の渡し方、直ったをテストで固定するまで。
Tips & Tricks
Drizzle ORM 使い方入門：SQLに近い型安全なスキーマとマイグレーション
Drizzle ORMをClaude Codeで実装。SQLに近い書き味でスキーマ定義、drizzle-kitのマイグレーション、リレーショナルクエリ、Zod連携まで。Prismaとの違いも。
Tips & Tricks
スケルトンスクリーンの実装：スピナーより速く“感じる”ローディングUIをReactで作る
スケルトンスクリーンがスピナーより体感が速い理由と、CLSを起こさない実寸合わせの作り方。Suspenseとの組み合わせ、CSSの書き方、使う場面/使わない場面を実コードで。
Use Cases
WebSocketかSSEかポーリングか：リアルタイム機能の設計判断と落とし穴
リアルタイム機能の選び方を実務目線で。WebSocket vs SSE vs ポーリング、プレゼンス、再接続とハートビート、複数サーバーのpub/scaleまで僕の事故込みで解説。
Use Cases
docker-compose 開発環境が「DBにつながらない」を一発で直す設計図（app+db+redis）
compose で app+postgres+redis を一括起動。depends_on と healthcheck の正しい組み方、ホットリロード、localhost 接続ミスの切り分けまで、僕が踏んだ失敗込みで解説。
Use Cases
Vercel Edge Functions実践：Middlewareで認証・リダイレクト・A/Bを捌く
Vercel Edge Runtimeの制約とMiddlewareの使い方を実コードで解説。認証・国別リダイレクト・A/Bテスト、いつEdgeでいつNodeか、Claude Codeでのレビュー観点まで。
Advanced
マイクロサービス分割で僕が最初に失敗した話とClaude Codeの使い方
テーブル単位で分けたら同期呼び出し地獄に。サービス境界・API契約・DB所有権をClaude Codeと固める実践手順を、動くComposeコード付きで解説。
Use Cases
MongoDBのスキーマ設計で迷わない：埋め込みと$lookupの判断軸
MongoDBは埋め込みと参照の判断で詰む。アクセスパターン起点のドキュメント設計、複合インデックス、$lookupを避ける集計を、動くコードで解説。
Use Cases
Claude Codeでスプレッドシート連携を自動化する実務ガイド
Claude CodeでCSV集計、Google Sheets API、Apps Script連携を実装する実務手順と失敗回避策。
Use Cases
Claude Codeでプロフィール編集APIが他人を書き換える事故を防ぐ設計
Claude Codeでユーザープロフィール機能を作ると起きるmass assignmentや画像アップロード事故を、僕の失敗込みで防ぐ実装手順。
Getting Started
Prisma入門：include/selectとN+1回避でクエリを型安全にする書き方
Prisma ORMの型安全クエリを実例で。include/selectでリレーションを取り、N+1を防ぎ、transactionで整合性を守る。Claude Codeに任せる勘所も。
Tips & Tricks
Reactトースト通知のキュー管理。複数表示・自動消去・aria-live対応
Reactトースト通知の難所はキュー管理。複数同時表示の制御、ホバーで一時停止、重複のまとめ、aria-liveでの読み上げまでコピペで動くコードで解説。
Tips & Tricks
CSS変数の使い方：var()・:root・テーマ切替をJSから動かす実装
CSS変数（カスタムプロパティ）の基本。--var と var()、:root とスコープ、継承、JSからの読み書き、ダークモード切替、フォールバックを、僕がハマった失敗込みで解説。
Use Cases
GraphQL入門からN+1・DataLoaderまで。RESTと住み分けて作る実装手順
GraphQLのスキーマ・リゾルバ・N+1とDataLoader・RESTとの違いを、コピペで動くTypeScriptコードと失敗談で解説。Apollo/urqlの選び方も。
Tips & Tricks
MSWでAPIモック：Vitestと画面で同じハンドラを使い回す
MSWでネットワーク層からAPIを横取りしてモックする手順。1つのhandlersをVitestのテストとブラウザ開発で共有し、Playwright併用や実APIへの切替まで実例で解説。
Use Cases
Node.jsのPDF生成で日本語が文字化けする前に：Puppeteerとpdf-lib
Webアプリの請求書・帳票PDFを日本語フォント文字化けなしで出す方法。Puppeteer/Playwrightとpdf-lib/@react-pdfの使い分け、改ページ、Claude Codeへの頼み方を実例で。
Use Cases
Claude CodeでAWSデプロイ自動化：事故らない手順とCI/CD設計
Claude CodeでAWSデプロイを自動化。CDKとGitHub Actions OIDCで「小さく出して安全に広げる」フローを、僕の失敗込みで具体的に解説。
Use Cases
Claude Codeでsharp画像処理を自動化：リサイズ・切り抜き・形式変換・一括処理
「いい感じに加工して」で事故った僕が、Claude Codeにsharpでのリサイズ・切り抜き・WebP/AVIF変換・一括処理を任せた手順を、動くコード付きで解説。
Tips & Tricks
Reactモーダルのアクセシビリティ:フォーカストラップとdialog要素の落とし穴
Reactモーダルのフォーカストラップ、ESCで閉じる、背景スクロール固定、aria-modal、フォーカス復帰、dialog要素と自作の違いを実装コード付きで。
Use Cases
SQLが遅い原因をEXPLAINで突き止めて直す手順
遅いクエリの特定からEXPLAINの読み方、インデックスが効かない原因、N+1の潰し方まで。Claude Codeと一緒にSQLを速くする実践手順を、コピペで動くコード付きで解説。
Tips & Tricks
Tailwind CSSの使い方のコツ：@applyを乱用せず崩れないUIにする実践Tips
Tailwind CSSのclassNameが伸びて崩れる前に。ユーティリティファースト、@applyの使いどころ、コンポーネント抽出、v4の変更点を実例で。
Tips & Tricks
Flexbox実用パターン｜中央寄せ・ナビ・等高カードを崩さない
Flexboxの中央寄せ、両端＋中央のナビ、等高カードをコピペで動くコードで紹介。横スクロールが消えないmin-width:0問題も実例で直します。
Use Cases
パスワードリセットの「再設定リンク」を安全に作る：トークン設計と落とし穴
パスワード再設定リンクをハッシュ保存・短い有効期限・1回限り・全セッション無効化で安全に実装する手順。ユーザー列挙を防ぐ応答まで、写して動くコードと失敗談つきで解説。
Advanced
APIレート制限の実装：トークンバケットとRedisで429を正しく返す
固定窓・スライディング窓・トークンバケットの違いから、Redisでの分散実装、429とRetry-Afterの返し方、IP/ユーザー/APIキー単位の設計まで、コピペで動くコード付きでまとめました。
Use Cases
Claude CodeでTwilio SMS連携を本番実装する方法：通知・Verify・Webhookまで
Claude CodeでTwilio SMS通知を実装。E.164、同意管理、冪等性、リトライ、Webhookまで実例で解説。
Use Cases
Web Components入門: Custom ElementsとShadow DOMで作る使い回せるUI部品
Reactにもう疲れた人向けに、ブラウザ標準のWeb Componentsを実例で解説。Custom Elementsの作り方、Shadow DOMのカプセル化、slot、Litでの書き方まで、コピペで動くコード付き。
Advanced
通知システムの設計：メール・プッシュをキューで送り、二重送信を止める
通知システムの裏側を設計する。メール／プッシュ／アプリ内のチャネル分離、配信キュー、テンプレート管理、オプトアウト、冪等性と再送まで、写して動くコードで解説。
Tips & Tricks
Reactのテーブル実装でソート・ページネーション・仮想化を詰める
Reactのデータテーブルをソート・ページネーション・列フィルタ・仮想化まで実装。自前の最小コードとTanStack Tableの使い分け、アクセシブルなtableマークアップを紹介。
Use Cases
Tauriアプリが10MBで済む理由とRust権限設計：Claude Codeで作る実録
Electronなら150MBのアプリがTauriだと10MB。なぜ軽いのか、Rust側のパス制限はどう書くのか、Claude Codeに任せた実体験で解説します。
Advanced
Playwright E2Eがすぐ壊れる僕が、フレーキーを潰すまで
Claude CodeでPlaywright E2Eを書く実践記。ロケータの選び方、auto-wait、storageState、CIのheadless実行、Trace Viewerでフレーキーテストを潰す手順を失敗談つきで。
Use Cases
Claude CodeでPWA化：オフライン対応とService Workerで更新事故を防ぐ
「manifestを置けば完成」で更新事故った僕の失敗から、Claude CodeでPWAをオフライン対応する手順を、コピペできるService Worker付きで紹介します。
Use Cases
サイト内検索の作り方｜全文検索・あいまい検索・UIを最短で実装
サイト内検索を自前DBか外部SaaSか迷う人へ。全文検索・あいまい検索・検索UIの選び方と、コピペで動くコードをMasaの失敗談つきで解説。
Tips & Tricks
Reactでカレンダーを自作する：日付ピッカーとタイムゾーンずれの倒し方
Reactで日付ピッカーを自作する手順。月グリッド生成、月送り、範囲選択、矢印キー操作、そして「日付が1日ずれる」タイムゾーンの罠まで、コピペで動くコードで解説。
Use Cases
2FAは「QRを出して終わり」じゃない。リカバリーコードと復旧で詰む話
TOTPの2要素認証で本当に難しいのは復旧。リカバリーコードの保存・ハッシュ化・復旧フローを、Claude Codeと作った実装コード付きで解説します。
Advanced
エッジコンピューティングとは？CDN・エッジ関数・オリジンの違いと選び方
エッジ関数とCDNは何が違う？なぜ速いのか、向く処理・向かない処理、Cloudflare Workers／Vercel Edge／Lambda@Edgeの選び方を、僕の失敗談つきで整理します。
Use Cases
Claude CodeでElectronアプリを安全に作る：preloadとIPCの境界設計
Claude CodeでElectronデスクトップアプリを作った実体験。contextIsolation・preload・IPC・ファイル検証・自動更新まで、事故りやすい所を実例で解説。
Use Cases
ページネーション実装で番号送りとカーソルを選ぶ基準とコード
ページ送り型の実装で迷うオフセットとカーソルの選び方を、URL設計・JSON API・落とし穴つきで解説。Claude Codeへの依頼文と動くコードも掲載。
Tips & Tricks
CSS Gridの実務：minmaxとauto-fitで崩れない2次元レイアウト
grid-template-columns、fr、minmax、auto-fitでレスポンシブを最小コードで。Flexboxとの使い分けとはみ出し対策まで、コピペで動く例で解説。
Use Cases
react-hook-form × zodでフォーム検証を二重化する実装手順
クライアントとサーバーで同じzodスキーマを使い回し、型安全・エラー表示・サーバーエラーの戻し方まで。問い合わせフォーム1つで動く実装を一人称で解説。
Use Cases
Claude Codeでソーシャルログインを実装: Next.js/Auth.jsとGoogle/GitHub OAuthの安全設計
Claude CodeでNext.js/Auth.jsのソーシャルログインを安全に実装する手順を、Google/GitHub OAuthと運用失敗例まで解説。
Comparison
CSR/SSR/SSG/ISRの違いと選び方：Next.js・Astroで迷わない判断基準
レンダリング方式4種の仕組み・速度・SEO・運用を、どの場面でどれを選ぶか中心に整理。Next.jsとAstroの実装と検証コマンド付き。
Use Cases
Stripe Checkout最短実装：Session作成・リダイレクト・Webhook確定
Stripe Checkout Sessionを作り、ホスト型ページへリダイレクトし、checkout.session.completedで確定するまで。コピペで動くTypeScriptと、成功ページを信じて事故った失敗談つき。
Advanced
Vitestのモックとカバレッジで、Claude Codeのテストを“落ちない”状態にする
Claude Codeが書いたVitestのテストがCIで落ちる。原因はモックの巻き上げとタイマーの後始末。vi.mockの使い方、カバレッジ計測、落ちたテストを直させる手順を実例で。
Use Cases
React Native入門：ExpoとReact Navigationで最初のアプリを動かす
Web(React)経験者がReact Nativeを最短で始める手引き。Expoのセットアップ、StyleSheet、Expo Routerでの画面遷移、ネイティブ機能まで、コピペで動くコードでつまずきを潰す。
Tips & Tricks
リッチテキストエディタ実装でcontenteditableに泣いた僕がTipTapに逃げた話
リッチテキストエディタ実装の地雷を回避する。contenteditableの罠、TipTap/Lexical/ProseMirrorの違い、保存形式、XSSサニタイズ、ペースト処理を実コード付きで。
Use Cases
Claude Codeのデータ可視化、グラフより先に決める3つのこと
Claude Codeで伝わるグラフを作る考え方。誰が何を決めるかを起点に、データ準備・グラフ選び・誤解させない見せ方を実例で解説。
Tips & Tricks
React.lazyとdynamic importでコード分割：重いUIを後回しにする
トップページが管理画面やグラフまで一緒に読み込んで重い。React.lazy+Suspense、Next.jsのdynamic、プリフェッチ、分割しすぎの罠まで、コピペで動く実装で送り分けを解説。
Tips & Tricks
画像のloading=lazyで本文が遅くなる罠: 遅延させない1枚の見分け方
loading=lazyを全画像に付けてLCPが悪化した僕の失敗から、遅延させないヒーロー画像の見分け方、CLS対策、IntersectionObserverとの使い分けを実装で説明します。
Tips & Tricks
メディアクエリとコンテナクエリの使い分け：壊れないブレークポイント設計
@mediaと@containerをどう使い分けるか。端末名で増やさないブレークポイント設計と、Claude Codeに任せて崩れない依頼の型を実例で解説。
Use Cases
Claude Codeで正規表現を作る方法: メール・電話・ログ抽出をテスト付きで安全に進める
Claude Codeで正規表現を作成・デバッグする実践手順。メール、電話、ログ抽出、テスト、落とし穴まで解説。
Tips & Tricks
npm/pnpm依存の更新で本番を壊さない手順 — lockfile・semver・Renovate
「npm update」一発で本番が落ちた失敗から学んだ依存管理の手順。lockfileの意味、^と~の違い、メジャー更新の進め方、Renovate自動化、npm auditまで。
Use Cases
Flutter入門の壁はウィジェットツリー。Claude CodeでDart状態管理まで突破する
Flutterのウィジェットツリーと状態管理(Riverpod/Provider)でつまずく人へ。Claude Codeで迷子にならず、iOS/Android同時開発まで進める書き方を実例で。
Use Cases
Stripeサブスクで二重課金を出した僕が学んだWebhook冪等性
成功画面で権限を開放して事故った話から、Checkout・Webhook署名検証・冪等性・解約処理まで。Claude Codeで課金事故を防ぐ実装を実コードで解説。
Tips & Tricks
React ドラッグ&ドロップ実装、dnd-kitでキーボード操作まで通す
React のドラッグ&ドロップを dnd-kit で実装。HTML5 Drag and Drop APIの限界、リスト並び替え、キーボード操作とタッチ対応まで、コピペで動くコード付き。
Advanced
React Error Boundaryでウィジェット1個の例外から画面全体を守る
なぜtry/catchではレンダー中の例外を拾えないのか。Error Boundaryの仕組み、react-error-boundaryでの実装、フォールバックUI、リセット、ログ送信、置く粒度までコピペで動くコードで。
Use Cases
shadcn/uiは「インストールする部品」じゃない。コードを自分のものにする使い方
shadcn/uiの使い方を、npx shadcn addでの追加、Radix UI+Tailwindの構成、コピーしたコードのカスタマイズまで。Claude Codeと組む手順を僕の失敗込みで解説。
Use Cases
React経験者がAngularでつまずく5点とClaude Codeへの頼み方
React出身者がAngularで戸惑うsignals・standalone・DI・RxJSを整理し、Claude Codeに型安全なフォームとテストを書かせる具体的な指示まで実例で紹介。
Advanced
Claude CodeでAPIバージョニングを安全に設計する実践ガイド
Claude CodeでAPIバージョニングを壊さず導入する設計・OpenAPI・移行運用の実践ガイド。
Use Cases
D3.jsの棒グラフ、scale・axis・joinでつまずく人へ
Claude CodeでD3.jsの棒グラフを実装する手順を、scale・axis・data joinに絞って解説。コピペで動くVite+TS版と失敗談つき。
Tips & Tricks
無限スクロールの難所はsentinelと仮想化：重複ロードと位置復元の対策
無限スクロールが本番で壊れる原因はsentinelの置き方と長大リストのDOM。IntersectionObserverの重複ロード防止、react-windowでの仮想化、戻る位置復元、SEO併用までReactで解説。
Use Cases
マルチテナント設計でデータ漏洩を防ぐ：分離レベルとtenant_idの貫通
テナント分離は行/スキーマ/DBのどれを選ぶか、tenant_idをどう全層に通すか、Row Level Securityで最後に止める設計まで。SaaSの顧客データ漏れを防ぐ実装を僕の失敗込みでまとめました。
Use Cases
「現在地を使う」で離脱されない位置情報の実装 — 許可・精度・プライバシー
Claude CodeにGeolocation実装を任せると許可拒否で離脱しがち。許可のタイミング、精度設定、拒否時の手入力、座標を残さないログ設計を実体験から解説。
Use Cases
Remix（React Router v7）入門：loader/actionでデータ取得と更新を1ルートに集める
Remix改めReact Router v7のloader/action入門。データ取得・更新、ネストルーティング、フォームの段階的強化、Next.jsとの違いを動くコードで解説。
Advanced
RBAC実装で横移動を防ぐ：ロール設計と認可ミドルウェアの作り方
ロール名を付けただけでは権限事故は防げません。permissionの設計、サーバー側ミドルウェアでの認可チェック、最小権限、UIの出し分け、ABACとの違いを、コピペで動くコードと失敗談つきで整理しました。
Use Cases
GitHub API 使い方入門：Octokit認証・レート制限・ページネーション
GitHub APIをOctokitで叩く実践入門。PATとfine-grained tokenの違い、REST/GraphQLの使い分け、レート制限とページネーション、issue/PR操作をコピペで動くコードで解説。
Use Cases
Radix UIの使い方をClaude Codeで覚える：ヘッドレスUIで壊れないモーダルを作る
ヘッドレスUIとは何か、Radix UIでDialog/Dropdown/Tabsを作る手順、shadcnとの違いまで。Claude Codeにアクセシビリティを壊させないコピペ用コード付き。
Use Cases
Claude CodeでJWT認証を安全に実装する実践ガイド
JWT認証の基礎、署名、Cookie、更新トークン、失効、鍵ローテーションをClaude Codeで安全に実装する。
Use Cases
Astro入門：Islandsで必要な所だけJSにして爆速サイトを作る
Astroが速い理由はJSをほぼ送らないから。Islands Architectureと型安全なContent Collections、出力モードの選び方を、このブログ自体をAstroで回す僕の実体験とコードで解説。
Tips & Tricks
SameSite=Laxで本番だけログインが切れた話。Cookie属性の正しい決め方
HttpOnly・Secure・SameSite・Domain・Path・Max-Age。Cookie属性の意味と決め方を、本番で踏んだ罠と一緒にNext.jsのコピペコードで解説します。
Use Cases
SaaSの雛形は「認証・課金・テナント・ダッシュボード」だけでいい
SaaSの土台は最初に何を作り何を後回しにするかで決まる。最小4点セットの構成、既製ボイラープレートと自作の判断、Claude Codeで土台を素早く組む手順を僕の失敗込みで。
Use Cases
「Googleでログイン」を自作したら別人のアカウントに入れた話。認可コードフロー+PKCEの正しい組み方
「Googleでログイン」を自前実装する手順を、認可コードフロー・PKCE・stateでのCSRF対策・トークンの保存場所まで、コピペで動くコードと失敗談つきで整理しました。
Tips & Tricks
navigator.shareで共有ボタンを作る：未対応ブラウザはコピーに逃がす
共有ボタンが半分の端末で無反応だった僕の失敗から、navigator.shareの使い方、HTTPSとタップ必須の制約、未対応時のコピー退避、ファイル共有まで実装で解説します。
Tips & Tricks
1万行のリストが重い。仮想スクロールで“見える分だけ”描く実装手順
大量リストが重い理由と、見えている範囲だけ描く仮想スクロールの作り方。react-window・TanStack Virtual・virtuaの選び方、固定/可変高さ、コピペ実装まで。
Tips & Tricks
GA4イベント設計の沼から抜けた話：命名を固定し計測漏れと二重計測を止める
PVは伸びるのに何が効いたか分からない。GA4とPlausibleのイベント命名を固定し、計測漏れ・二重計測・同意管理(consent mode)まで実装で潰した記録。コピペで動くJS付き。
Use Cases
GitHub Actionsを速く安く回す: matrix・cache・reusable workflow実践
GitHub Actionsのmatrixビルド、cacheで高速化、reusable workflowで重複削減、Environmentsで承認まで。コピペで動くYAMLとコスト削減のコツを実体験で解説。
Use Cases
Claude CodeでThree.jsの3D商品ビューアを作る｜白画面とメモリリークの直し方
「かっこいい3Dにして」では真っ白なcanvasが返ってくる。Claude CodeにThree.jsを任せて回る商品ビューアを作り、白画面とdispose漏れを潰すまでを実体験で書きました。
Tips & Tricks
Claude CodeにFramer Motionを書かせたら跳ねすぎた話と直し方
Claude CodeでFramer Motion（Motion for React）を実装。motion・variants・AnimatePresenceの使い方と、跳ねすぎ・exit不発を直した実例コードを公開。
Use Cases
Claude CodeでLPを作る：CVを生むヒーロー・CTA・計測の設計
見た目だけのLPはなぜ売れないのか。Claude Codeでヒーロー、CTA設計、表示速度(LCP)、計測、A/Bテストまで作り込み、コンバージョンを上げる実装手順。
Tips & Tricks
A/Bテストで「勝った」が嘘になる瞬間。収益化導線の正しい計測
クリックは増えたのに売上は減った。僕が踏んだ罠を起点に、Claude CodeでA/Bテストの割り当て・計測・有意差・ロールバックを安全に作る手順を解説。
Use Cases
Terraform入門：state管理とplan/applyの違いを、事故らず覚える
Terraformのstate管理（リモートstate・ロック）とplan/applyの違いを、クラウド非依存のHCLとコピペで動く例で解説。module化とマルチクラウドの考え方、Claude Codeでの差分レビューまで。
Use Cases
AWS Lambda入門：最初の関数とトリガー4種（API Gateway/S3/cron/SQS）の選び方
AWS Lambdaを初めて触る人向け。最初の関数を5分でデプロイし、API Gateway・S3・EventBridge(cron)・SQSのトリガーをいつ使うか、料金の考え方まで実例つきで整理します。
Tips & Tricks
navigator.clipboardでコピーボタンを作る：HTTPで動かない罠と権限の対処
コピーボタンが社内検証のスマホだけ無反応だった僕の失敗から、navigator.clipboard.writeTextの使い方、HTTPSと権限の制約、古いexecCommandへの退避、Reactでの成功表示まで実装で解説します。
Use Cases
管理ダッシュボードをReactで作る：チャート選びからURL同期まで
管理ダッシュボードをReactで作るときに迷う5点を実装で解決。チャート選び、データ取得とキャッシュ、フィルタのURL同期、グリッド、大量データ対策を動くコードで。
Use Cases
Kubernetesデプロイ入門：kubectl applyからローリングアップデートとロールバックまで手で動かす
Deployment/Service/Ingressの役割、マニフェストの書き方、kubectl apply、ローリングアップデートとロールバック、liveness/readinessを最小YAMLで手を動かして覚える入門。
Use Cases
React Hook Formのregister/useFieldArrayで再レンダリングを止める
React Hook Formの使い方を仕組みから整理。register/useForm/handleSubmit、非制御で再描画を減らす理由、Controller連携、useFieldArray、formStateの罠まで通しで解説。
Tips & Tricks
フィーチャーフラグの段階的リリースと消し忘れ負債をClaude Codeで防ぐ
if(flag)を足すだけでは本番で破綻する。フラグの種類分け、環境変数→DB→SaaSの段階実装、段階的ロールアウト、寿命管理までを僕の事故込みで実装解説。
Use Cases
エンジニアのポートフォリオサイト、何を載せて何を捨てるか
ポートフォリオに必要なのは派手な演出じゃなく、成果物・役割・数字。Claude CodeとAstroで静的サイトを作り、Cloudflare Pagesに公開するまでを実体験で。
Advanced
WebAssembly入門：RustからWasmをビルドしてJavaScriptと連携する
Wasmで何が速くなり何が遅くなるか。Rustからのビルド、JSとのデータ受け渡し、向くワークロードと向かないものを動くコードで整理。
Tips & Tricks
.envと.env.localを混ぜて本番が落ちた話。環境変数を型付きで守る設計
.envと.env.localの使い分け、.gitignore、zodでの起動時バリデーション、本番への注入、クライアント露出の境界まで。環境変数を事故らせない型を作る。
Use Cases
Jotaiのatomで状態管理を組む：派生・非同期・Zustandとの使い分け
Jotaiのatomの基本から派生atom・非同期atom・Provider不要のしくみ、ZustandやReduxとの違いと選びどころまで。コピペで動くタスクボード付き。
Tips & Tricks
Webアプリのキーボードショートカット実装：Cmd/Ctrl判定と入力中の無効化
JavaScriptでキーボードショートカットを実装する方法。keydown、修飾キー判定、入力中の無効化、?キーでヘルプ、Reactフックまでコピペで動く形で解説。
Use Cases
Claude CodeでECサイトを自作する：カート・在庫・Stripe決済を段階実装
ECサイトを自分で作る手順を、商品・カート・在庫引き当て・Stripe決済・Webhook注文確定まで、コピペで動くコードと落とし穴つきで紹介します。
Use Cases
Deno入門：Nodeとの違いと--allow権限を、動くAPIで理解する
Deno入門。Nodeとの違い（標準でTS・URLインポート・権限モデル）、deno.json、--allow権限、npm互換、Deno Deployまで。コピペで動くAPIとテストで一気につかむ。
Use Cases
ブログCMSは自作かヘッドレスか。AstroとClaude Codeで僕が出した結論
ブログCMSを自作するかmicroCMS/Contentfulに頼るか。記事モデル設計・MDX運用・SSG/ISRの判断を、Astroで自サイトを回す僕の実体験とコードで整理する。
Use Cases
cmdkでCmd+Kコマンドパレットを自作する（検索・キー操作・最近使った項目）
cmdkでReact製コマンドパレットを実装。Cmd+K起動、ファジー検索、キーボード移動、アクション登録、最近使った項目、アクセシビリティまでコピペで動くコードで紹介。
Use Cases
Claude CodeでZustand状態管理を設計する実装ガイド
Claude CodeでZustandのstore、selector、persist、非同期action、テストを実例つきで設計します。
Use Cases
Cloudflare Workers入門：wranglerでKV/D1/R2を使い、注文APIをエッジにデプロイする
wranglerのローカル開発からデプロイまで。KV/D1/R2/Durable Objectsの使い分け、CPU時間とNode非互換の壁、Claude Codeへの頼み方を、実際に動くコードで解説します。
Use Cases
Claude CodeでWebSocketチャット：再接続とレート制限まで動く実装
「とりあえず作って」で出てくるWebSocketチャットは公開後に必ず壊れる。認証・再接続・レート制限まで動くNode.jsコードと、僕がやらかした落とし穴を共有します。
Tips & Tricks
パンくずリストをReactで実装：aria-currentとJSON-LDで現在地とSEO対応
色だけの現在地表示は支援技術に伝わらない。aria-current・BreadcrumbListのJSON-LD・パスからの自動生成まで、コピペで動くReactコードで作る手順を僕の失敗込みで解説。
Use Cases
TanStack Queryを「ただ動く」で終わらせない。Claude Code流キャッシュ設計
「データ取得作って」だけで頼むとキャッシュが崩れる。query key設計・無効化・楽観的更新を、Claude Codeに正しく任せる手順をv5の動くコードで解説。
Use Cases
Bun入門：Nodeとの違いと、速い理由をbun install/test/serveで体感する
Bun入門。Nodeとの違い、bun install/run/test/buildの速さ、Bun.serveなど組み込みAPI、Node互換の実際、いつ選びいつ避けるか。コピペで動くAPIとテストで一気につかむ。
Use Cases
tRPC入門：スキーマ共有なしでフロントとバックの型をつなぐ
tRPCの使い方を一人称で解説。router/procedure、zodのinput検証、React Query連携、いつtRPCを選ぶかまで、コピペで動くTypeScriptと失敗談で。
Use Cases
RSSフィードが壊れて誰も気づかない事故をClaude Codeで防ぐ
RSSが配信されない、XMLが壊れて読者の購読が切れる。Claude CodeでRSS 2.0/Atomを絶対URL・エスケープ・検証込みで安全に作る手順を、失敗談つきで解説。
Use Cases
pnpm workspaceの使い方とfilter実戦:同じButtonを3回コピペしたら卒業
pnpm-workspace.yamlとworkspace:プロトコル、--filterでの対象実行、hoistingで省容量になる仕組みを、Claude Codeのレビューと合わせて実例で解説。
Use Cases
Zodの入力バリデーションをClaude Codeに任せて型安全にする手順
フォーム・API・環境変数・WebhookをZodで実行時検証する型安全パターンを、Claude Codeへの依頼文ごと一人称で解説。safeParseとparseの使い分けも。
Use Cases
Algoliaでサイト内検索を爆速化｜InstantSearch・インデックス設計・料金まで
Algoliaのサイト内検索をClaude Codeで実装。InstantSearchのUI、安全なインデックス設計、secured APIキー、料金の見積もりを、僕の漏洩ヒヤリ体験つきで解説。
Use Cases
サイトマップを毎ビルド今日付にして順位を落とした話とClaude Code自動生成
lastmodを全URL今日付にしてGoogleの信頼を失った失敗から学ぶ。Claude CodeでXMLサイトマップを多言語hreflang込みで自動生成する手順を実体験で解説。
Tips & Tricks
TypeScriptユーティリティ型入門: Claude Codeで実務の型を安全に作る
Pick/Omit/Partialなどの使い分けを、Claude Codeで動く実例と失敗例から学ぶ実務ガイド。
Use Cases
Nxモノレポ入門：affectedで変更箇所だけ速く回す設計
Nxのタスクキャッシュ・依存グラフ・nx affectedで、巨大リポジトリのCIを変更箇所だけに絞る方法。Claude Codeとの相性も含めコピペで動く手順で解説。
Tips & Tricks
Claude Codeで学ぶTypeScript Generics実践: keyof・制約・API型
Claude CodeでTypeScript Genericsを安全に設計する手順を、API型・keyof・mapped types・tsc検証で解説。
Use Cases
Claude CodeでSendGridメール送信を安全に実装する方法
SendGridの設定、Mail Send API、失敗対策までClaude Codeで安全に実装する実践ガイド。
Use Cases
Turborepo入門：turbo.jsonとキャッシュで遅いモノレポを救う
毎回フルビルドで待たされるモノレポを、Turborepoのタスクパイプラインとキャッシュで速くする。turbo.jsonの書き方、リモートキャッシュ、Nxとの違いまで実例で。