Atomic Designを実践して得た学びと失敗 - コネヒト開発者ブログ

🙋‍♂️エンジニアの@dachi_023です。約4ヶ月ぶりに記事を書きます、がんばります。 この記事について コンポーネントやAtomic Designについて書いています。ここではUIデザインのフローに関するAtomic Designの実践ではなく、開発(実装)のフローにはめ込んだ場合にどうすべきなのか、というお話をしています。 コンポーネントとAtomic Design ReactやVueをはじめとするライブラリのお陰でフロントエンド開発に「コンポーネント」という考え方が浸透した今日この頃ですが、そんなコンポーネントの設計についての話なんかをしているとよく現れるのが今回の主題に挙げている「Atomic Design」です。Atomic Designはデザインシステムを効率よく作成するための手段のひとつですが、その中に登場するコンポーネントを5階層(Atoms, Molecules,

[dachi023]

書いた📝

[karauma]

「Organismsはそれ単体で画面上に存在しうるもの」と考えていて、それに満たないもので複数のAtomsによって構成されていれば全てMoleculesとしています。Atomic Design Methodology に出てくるUIを例に