TIL - React Hooks

What follows is notes from a class. Incomplete thoughts & code that probably will only make sense to me. Given enough time, even that may be a stretch! Reference at your own risk 😂


Intro to React Hooks

Hooks replace the old Class syntax!!


The useEffect hook is a side effect, separate to the normal process you have going on in your functions. This can replace the lifecycle methods componentDidMount & componentDidUpdate & componentWillUnmount. componentWillUnmount only comes into play if your useEffect function returns a function: unmount

// Callback
() => {
// Do something on mounting/updating
const handler = setTimeout(() => {
// just using a timeout as an example because it needs cleanup
}, delay);

// [optionally] Clean up when done (componentWillUnmount)
return () => {
// Dependencies:
[value, delay] // Only re-run effect if these values change

More Hooks

Here are the docs for all the hooks.

My CodePen Pens