使用している React のバージョンは16.8.4。 レンダー後の処理を指定するための仕組み React Hooks の一つであるuseEffectは、レンダー後に実行したい処理を React に伝えるための仕組み。 useEffect(fn)と記述すると、DOMの更新が終わったあとにfnを実行する。 useEffectはレンダー後に必ず実行される。最初にレンダーした際もそうだし、propsやstateに変更があってレンダーし直した際もそう。そこに区別はない。 以下の例では、このコンポーネントが表示された際にeffect!というログが流れる。 そしてボタンを押下した際にも、その都度effect!というログが流れる。 import React, {useState, useEffect} from 'react'; const App = () => { const [state, set