はじめに UI(画面)コンポーネントを切り出したいときにどういう粒度で切り出したらいいか迷う時があります。 適切な粒度で切り出しておかないと、位置を組み替えたりデザインを修正したい場合に、使い勝手が悪くて作り直しになってしまうからです。 メンテナブルなUIコンポーネントに切り出すにはどうしたらよいでしょうか。 いろいろ調べた末、Atomic Design(アトミックデザイン)というアイデアに行き着きました。 このAtomic Designを使ったコンポーネント指向のUI開発を(序)(破)(Q)のシリーズを使って紹介したいと思います。 (序)では、Atomic Designがどのようなものかをご紹介します。 (破)では、Atomic Designを導入した際にうまくいかなかった点と工夫した点をご紹介します。 (Q)では、具体的な開発例をご紹介します。 このシリーズが同様に困っている現場の参考
![Atomic Designとは 〜Atomic Designを使ったコンポーネント指向のUI開発:序〜 - UGAP Engineer's Blog](https://cdn-ak-scissors.b.st-hatena.com/image/square/f7b013c7fae548ea60f1e9e9e1d16aa9d996d600/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fu%2Fuggds%2F20180701%2F20180701112855.png)