- More reading on Full-stack React , TS & Node. React hooks.
useState
, replaces state
and setState
in class components. used to update single values rather than objects. For complex objects useReducer
might be better.
useEffect
, similar to componentDidMount
and componentDidUpdate
in class components. However, they are run before drawingon the screen happens. It takes a second parameter to watch a prop or state for changes. You use this hook this multiple times. Passing an empty array to the second parameter to this hook forces this to run only once.
useCallback
, takes an instance of function for first argument, the second argument is an array of items that might change. This exists to save memory.
useMemo
, similar to useCallback
. it can cache the results of a long running task, will only re-run in the the provided props or state that it subscibed to has changed, these are passed in as a second array argument.
useReducer
, this similar to react redux. takes two parmeters reducer
and initial state
. It returns a state object and and disapatcher. The reducer filters what to do based on the dispatcher.
useContext
, this allows for global state which can injected into any child regardless of hierarchy. Alternative approach is to use React Redux.
useRef
, used to access the instance of element and opt out of reacts model. this does not trigger a re-render if the value changes.