良いコンポーネントを作るために気をつけている3つのことを読んだ

最近コンポーネントの粒度や設計に悩んでいるのでとても参考になる記事だった。

コンポーネントの要素を、具体例をもとに要素の抽出からはじめて、どのように作っていくかが書かれている。

まず要素の抽出なんだけど、「ここまで細かく分割するのか」というのが最初の感想。

Icon, UserName, UserId など、本当にひとつひとつの要素を細かく分割している。

だがこれは後々の抽象度を揃えることに大きく影響すると思うと、非常に大事なんだろう。

props でコンポーネントを渡すことを繰り返すことで、多くの子コンポーネントを使う必要があるコンポーネントでの見通しがよくなっている。

そして利用する側を意識しないコンポーネントを作る、これは props の命名をより汎用的にするようなもの。

記事内の例のように、そのコンポーネントの関数名と同じ命名をしてしまうと他から使いにくくなってしまうので汎用性と保守性が下がる。

個人的には要素抽出のところがとても参考になった。