フロントエンドカンファレンス沖縄2023
レギュラートーク 10分

なぜコピペで利用するコンポーネント集を採用するのか?

mottox2 mottox2 mottox2

@shadcn/uiやTailwind LabsのCatalystを中心に、自分のプロジェクトにコードをコピーペーストで追加するコンポーネント集が注目を集めています。一見古臭い方法のように思えますが、必要なコンポーネントを選んでプロジェクトにコピペで導入することには大きなメリットがあります。

従来のコンポーネントライブラリはnpmやCDN経由で導入し、コードの中身には触れず、スタイルは上書きしてごまかしつつ運用する必要がありました。
しかし、こういった形態のコンポーネント集はコードが手元にあるため、カスタマイズが柔軟に行えます。余白などのスタイリングはもちろん、使わないボタンサイズや影など、不要なプロパティを削除できます。新しいコンポーネントの追加も作法を守れば簡単です。

こういったコンポーネント集のメリット・デメリットや、実際にカスタマイズしながら実務で導入した例を紹介します。