Reactの副作用についてAIに聞きまくって理解した話

やり方

1. まずはストレートに聞いてみる。
2. 引っかかるところをさらに聞いてみる。
3. テストをお願いする。

最後にテストをお願いするのが肝

まずはストレートに聞いてみる。

ふーんそうなんか、レンダリングとは直接関係ない処理を副作用と言うんか。

引っかかるところをさらに聞いてみる。

いろいろ副作用の例を出されたけど、共通点がいまいちわからない...
副作用の定義を聞いてみる。

よくわからんからより詳しく聞いてみる。

なるほど。じゃあコード書いてみる。

おお。やっぱそうやんな。
count = count + 1はHomeコンポーネント外のcount変数に影響を与えるもんなー。

ついでにuseEffectについても聞いてみた。

ちなみにuseEffectを使わないときどのような問題が起きるかも調べてみたら、結構大変なことが起こるらしい。
例えばfetchを使う場合、useEffectを使ってタイミングの管理をしないと、コンポーネントがレンダリングされるたびに呼び出される。課金制のものを使っているときは何度も呼び出されるため大変なことになる。

テストをお願いする。

最後に理解度チェック！
これが重要

テストをお願いすると上記のような問題が5問ほど出てきました。

ついでに副作用のまとめ。

データのフェッチ（APIリクエスト）、DOMの操作、タイマーの設定、イベントリスナーの登録や解除、サブスクリプションやリソースの解放みたいなReactコンポーネント外に影響を与えるような処理をReactでの副作用と言って、副作用を管理（発火のタイミングコントロールなど）するのがuseEffect。