TypeScript版:DRY(重複排除)教育コンテンツ(9章アウトライン)📚💖
第1章:DRYってなに?「コピペ禁止」より大事な話🧻✨
- ゴール:DRY=「同じ知識(ルール)を複数に置かない」を体感する😊
- よくある事故:仕様変更1回で直す場所が5か所…😱
- ミニ演習:小さな“WETコード(重複だらけ)”を見て「どこが怖い?」を言葉にする📝
- AI活用🤖:Copilot/AIに「重複っぽい箇所を指摘して」→最後は自分で理由づけ🧠 (GitHub Docs)
第2章:重複の種類を見分けよう👀🔍(コード/ルール/データ/例外)
- ゴール:「これは重複!」を分類できるようになる✨
- 4つの典型:
- ①同じ処理のコピペ📄
- ②同じ条件・計算(知識の重複)🧮
- ③同じ文字列・キー・URL(データの重複)🏷️
- ④同じtry/catchや同じエラー整形(例外の重複)🚨
- ミニ演習:サンプルに“重複ラベル”を貼る(分類クイズ)🏷️😆
第3章:まずは最強の基本技!関数抽出&引数化✂️🧩
- ゴール:重複3か所→1か所へ、を安全にできる😊
- 扱うこと:
- 関数抽出(小さく切る)
- 引数化(違う部分だけ渡す)
- 早期returnで分岐をスッキリ🚪
- ミニ演習:同じロジックが3回ある→1関数にまとめる✅
- AI活用🤖:リファクタ案を出させて「読みやすさ」を採点する(命名チェック)📛
第4章:魔法の文字列を卒業!定数・辞書・ユニオン型でDRY🏷️✨
- ゴール:文字列コピペ("paid" とか "pending" とか)で死なないようにする😇
- 扱うこと:
- constの集約(1か所に置く)📌
- 辞書(Record)で“対応表”を1か所化🗂️
- ユニオン型("paid" | "pending")でミスを減らす🛡️
- ミニ演習:ステータス文字列の散らばりを「型+定義の1か所化」で解消🌟
第5章:TypeScriptならでは!型でDRY(形の重複を減らす)🧠🧱
- ゴール:同じような型定義をコピペしないで済むようになる😊
- 扱うこと:
- type / interface の使い分け(超入門レベルでOK)
- Pick / Omit / Partial / Readonly / Record で再利用✨
- 「入力DTO」「画面表示用」「保存用」で形がズレる時の整理📦
- ミニ演習:似た型を3つ→共通型+Pick/Omitで整理する🧩
第6章:条件分岐のDRY(同じifが増える地獄を止める)🌪️➡️🌿
- ゴール:同じ条件チェックを何回も書かない設計にする😊
- 扱うこと:
- ガード関数(isXxx)で条件を1か所へ🛡️
- 判定ロジックと処理を近づける📍
- 判定結果に名前をつける(読みやすさ爆上がり)📛
- ミニ演習:同じifが散らばってる→判定関数を作って1回にする🎯
第7章:エラー処理のDRY(try/catchコピペ地獄から脱出)🚨🧯
- ゴール:エラー処理を“毎回その場で”書かないようにする😊
- 扱うこと:
- 共通のエラー整形(ユーザー向け文/ログ向け)📝
- Resultっぽい返し方(成功/失敗を分ける考え方)✅❌
- API呼び出しを薄いラッパ関数で包む(fetch等の共通化)🌐
- ミニ演習:API呼び出し3か所のエラー処理→1か所に寄せる✨
- AI活用🤖:AIに「このtry/catch重複、共通化できる?」を相談→最終判断は自分🧠
第8章:DRYの落とし穴(やりすぎ注意!)🐙⚠️
- ゴール:「共通化しすぎ」で読めなくなるのを防ぐ😊
- ありがち失敗:
- “たまたま似てるだけ”を無理に統一して地獄😵
- 万能utilsが巨大化して迷子🗺️
- 早すぎる抽象化で逆に変更しにくい🧩💦
- ここで作るもの:判断チェックリスト📋✨
- 「同じルール?」それとも「似てるだけ?」
- 変更理由は同じ?誰が変更する?
- 共通化すると呼び出し側が読める?
第9章:まとめプロジェクト(DRY改善を1周する)🎯🛠️🎉
- ゴール:DRYを“手順”として身につける(ここが最強💪✨)
- 題材例:カート計算(割引・送料・クーポン)🛒💳
- 進め方:
- 重複を発見(第2章の分類ラベル)🏷️
- 関数抽出&引数化(第3章)✂️
- 文字列/対応表/型で整理(第4〜5章)🧱
- 条件判定をまとめる(第6章)🛡️
- エラー処理を寄せる(第7章)🚨
- “消さなかった重複”も理由を書いてOK(判断力UP)📝✨
- AI活用🤖:Copilotに「重複候補の棚卸し」「命名案」「テスト観点」を出させて、最後は自分で整える (GitHub Docs)