Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
DRY原則を誤った結果生まれた技術的負債
Search
Tech Leverages
June 30, 2023
Technology
0
6.1k
DRY原則を誤った結果生まれた技術的負債
DRY原則を誤った結果生まれた技術的負債
Tech Leverages
June 30, 2023
Tweet
Share
More Decks by Tech Leverages
See All by Tech Leverages
古き良き Laravel のシステムは関数型スタイルでリファクタできるのか
leveragestech
1
1k
リファクタリングいつやるの? 〜依存の整理〜
leveragestech
0
77
ディメンショナルモデリングを軽く語る
leveragestech
1
3.8k
アクターモデルによる効率的な分散システム設計
leveragestech
0
3.6k
Terraform による運用効率化の取り組みと最新のテストアプローチの紹介
leveragestech
0
3.6k
OpenFGAで拓く次世代認可基盤 〜予告編〜
leveragestech
0
3.6k
リソース・管理効率の向上だけでない、分散システムとしてのTiDBの魅力
leveragestech
0
3.6k
作ってわかる!非同期ランタイム
leveragestech
0
3.6k
レバテック開発部 技術広報 これまでとこれから
leveragestech
0
180
Other Decks in Technology
See All in Technology
Delegating the chores of authenticating users to Keycloak
ahus1
0
130
フィンテック養成勉強会#54
finengine
0
180
OpenHands🤲にContributeしてみた
kotauchisunsun
1
460
生まれ変わった AWS Security Hub (Preview) を紹介 #reInforce_osaka / reInforce New Security Hub
masahirokawahara
0
110
製造業からパッケージ製品まで、あらゆる領域をカバー!生成AIを利用したテストシナリオ生成 / 20250627 Suguru Ishii
shift_evolve
PRO
1
140
Claude Code Actionを使ったコード品質改善の取り組み
potix2
PRO
6
2.4k
プロダクトエンジニアリング組織への歩み、その現在地 / Our journey to becoming a product engineering organization
hiro_torii
0
130
Lambda Web Adapterについて自分なりに理解してみた
smt7174
4
120
【TiDB GAME DAY 2025】Shadowverse: Worlds Beyond にみる TiDB 活用術
cygames
0
1.1k
急成長を支える基盤作り〜地道な改善からコツコツと〜 #cre_meetup
stefafafan
0
130
AIとともに進化するエンジニアリング / Engineering-Evolving-with-AI_final.pdf
lycorptech_jp
PRO
0
110
MySQL5.6から8.4へ 戦いの記録
kyoshidaxx
1
260
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
694
190k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
20k
Code Review Best Practice
trishagee
68
18k
KATA
mclloyd
29
14k
BBQ
matthewcrist
89
9.7k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
60k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
670
Embracing the Ebb and Flow
colly
86
4.7k
Making Projects Easy
brettharned
116
6.3k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
124
52k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
17
940
Transcript
DRY原則を誤った結果 生まれた技術的負債
TL;DR DRYかどうかの前に単一責務かどうか考えて
これは本当にあった怖い話です
teratailにはこんなコンポーネントが存在します
teratailにはこんなコンポーネントが存在します 違い、分かりますか?
<a>タグ <button>タグ
HTMLタグの種類が違うだけなのに 同じスタイルを都度定義するの、面倒だな ...
そうだ!propsにhrefがあるかどうかで 出し分けるように実装しよう! DRY原則の適用だ!
None
None
最初はこれでも問題なかった 最初だけね...
- 内部コンポーネントを制御するためのPropsが際限なく追加される - 内部で利用しているコンポーネントの機能を制御する必要が出てきた - 制御変数が多くなりすぎて内部実装が複雑になる - 他のライブラリ(ReactHookForm等)との組み込みがしづらくなる - 誰も手をつけられない神ボタンコンポーネントの☆完☆成☆
生まれた問題点
None
結局何がいけなかったの? - DRY(Don’t Repeat Yourself) 原則の適用を間違えた - 似て非なるものを同一視してしまった - SRP(Single
Responsibility Principle)に違反した
どうすればよかったの? - 各コンポーネントを責務という観点で独立させる - <a>タグはHTMLにおいて他のリソースへの参照を示す - <button>は文書上のフォームのコントロールや単純なボタンとしての機 能を提供する
TL;DR DRYかどうかの前に単一責務かどうか考えて