フロントエンドエンジニアの登場以降サービスのUIはどんどん使いやすくなる一方で裏側のUIロジックは複雑になる一方です。
Reactはコードを宣言的にかけるようにしてくれましたが、現在のアプリケーションはそれでもなお複雑なロジックを抱えています。
私は業務の中でReact/Next.jsのアプリケーションのリファクタリング業務などを行っており、その経験を元に現在業務でReactを活用している人向けに、分かりやすいReactコンポーネントの書き方について紹介させていただきます。
大まかな構成
※構成は現状の想定のため少し内容の変更があるかもしれません。