カスタムHooksとComponentsの使い分け

カスタムhooksとComponentsの使い分けは、UIが共通するか否かである。

カスタムhooksは、機能（ロジック）を共有するために切り出す。
UIはカスタムhooksを呼び出した各コンポーネントに任せる。
ここでのロジックは、状態管理やイベントハンドリング、データ取得などを指す。
カスタムhooksは、必ずロジックを含む。

一方でコンポーネントは、UIと機能のどちらも一体化して再利用する場合に使用する。
当然コンポーネントは必ずしもロジックを含む必要はない。