Atomicデザインで開発を進める上での呟き

みなさん、reactなりvueなりでコンポーネントを作るときにどの様にして開発を進めていますか？

今開発中のアプリは基本的にatomicデザインベースでコンポーネントの管理をしていますが、こんなこと多々ないでしょうか？

「これのコンポーネント作ったっけ？」「既に似たようなコンポーネントあった」「これ使われてるの？」🤔

などなど、独自componentに切り出している場合は、このような疑問が良くあるはずです。

このような現象に陥る原因としては、他にも使えそうという理由で必要以上にコンポーネントを切り出していたり、管理が甘かったりなどなど（ほぼコレ）。

仮に、storybookを使っていても、結局使わないものなどが出てくるので、storybookは解決にはなり得ないかと。

もし、コンポーネント管理をデザイナー主導で行い、コンポーネンの切り出しは要相談の上でドキュメントに残すなどすれば上記のような現象には見舞われないはず。

そこで、最近思っているのがコンポーネントは利用する単位でライブラリに分けてつかえば良いのではということです。

Packageのインストール時に、開発しているアプリに必要なコンポーネントだけを指定してインストールするようにしておけばバンドルサイズも節約できる。 コンポーネントに機能やデザインを追加する場合には、デザイナーと相談の上で行う。 また、無限にpropsが増えていく現象も抑制できることで、一つのコンポーネントに機能てんこ盛りという事態も防げ、テスト自体も機能とデザインでしっかり分離できる。

ただデメリットとしては、ある程度の規模の開発にならないとパッケージの管理コストが掛かってしまうという点で小規模だと正直面倒臭いということですね。