React components have always relied on lifecycle methods for side effects. While lifecycle methods get the job done, they’re often overly verbose and have large margins for error.
It’s easy to forget to “clean up” a side effect when a component unmounts, or update the side effect when props change. As Dan Abramov preaches: Don’t stop the data flow.
React recently introduced a new way to deal with side effects: the
useEffect hook. Translating lifecycle methods to
useEffect calls can be confusing at first. It’s confusing because we shouldn’t be translating imperative lifecycle methods to declarative
useEffect calls in the first place.