Atomic Design ベースのコンポーネント設計を考えてみた - mya-ake com

背景筆者が個人的に仕事を受けはじめた会社のフロントエンドのプロジェクトを立ち上げることになりました。 そこでせっかく新しく作る機会があるならコンポーネントの分割の仕方（コンポーネント設計）を明確に定義したいと思いました。 そもそもなんで分け方を定義したいとなったかというと、後からメンバーがプロジェクトに入ってきたときに、スムーズにプロジェクトに入ってもらうためです。 今まで作ってきたプロジェクトでのコンポーネントの分け方は、「2,3回使う場合はコンポーネントに分ける」 「長くなって見通しが悪いコンポーネントは分ける」など曖昧なところもありますがシンプルなものでした。 ただこの分け方をするとコンポーネント自体が大きくなりがちでした。 今のところプロジェクトに関わる人数も少なく、個々のメンバーのレベルも高いため運用できていますが、人が増えた場合や他のメンバーとなった場合は「苦しいのではないか？

[karauma]

原典を読んでなんとなく実装する際のコンポーネント分割の指標にできそうでした。 ただ 5 つのカテゴリの中でワイヤーフレームとなる Templates は不要そう。 Atoms,Molecules,Organisms,Pagesの4つ

[kwbtsts]

これを読んで今更ながらAtomicデザインのルールをちゃんとした方が良いい気がしてきた