第6部 コンポーネント設計

ここまで何度も「繰り返しはコンポーネント化で解決します」と先送りにしてきました。第6部で、その約束を回収します。

第3章で見たとおり、Tailwind の「クラスが長くなる」という弱点は、同じ長いクラス列を何度も書くときに最も痛みになります。ボタンを 50 か所に置くのに、毎回 15 個のクラスをコピーするのは現実的ではありません。この重複をどう減らすか——それがこの部のテーマです。

減らし方は、再利用したいものによって変わります。第22章で @apply・カスタム CSS・コンポーネント抽出の役割を比較します。第23章では再利用を支える道具（clsx・tailwind-merge・CVA）、第24章では Rails、第25章では React での具体的な設計を扱います。