Reactにおける共通コンポーネント設計のアンチパターン

株式会社 Sally エンジニアの @piesukeです。 弊社では、マーダーミステリーをプレイできるアプリ「ウズ」と、マーダーミステリーを制作しウズ上で利用できるアプリ「ウズスタジオ」を開発しています。 最近良かったマーダーミステリーは「青いクジラは沈まない」です。 複数のWebサービスを展開する弊社では、開発効率の向上と車輪の再発明防止のため、頻繁に使用されるコンポーネントを共通コンポーネントとして管理しています。 しかし、共通コンポーネントは多岐にわたる箇所での利用を想定する必要があり、設計上の考慮が不足すると、結果として使いづらいコンポーネントとなることがあります。 本稿では、共通コンポーネントの作成・運用経験から得られたアンチパターンを紹介します。 前提：弊社のコンポーネントの共通化の運用 turborepoを使ったモノレポで運用している デザイン時に何度も使われるコンポーネント