React - Base hooks
Hello world of hooks
These are special functions (always starting with use for linting purposes) that can be used only inside functional components
useState introduces state management into functional components. We can keep local state of the component and render its content based on it.
useEffect allows us to execute code when some variables change between renders, so we can react to the changes and update based on them.
Usage of this two basic hooks is fundamental to advance further.
Rules of hooks
I respect the principal rules of hooks:
They must be used only inside functional components
They must not be executed conditionally (no hooks inside if statements / arrays forEach looping etc.)
useState usage
I know how to introduce state into the functional component
I know when to use plain values and when utilize callback functions as arguments
useEffect usage
I can add effects to react to the changes of the observed variables.
I understand the concept of dependency array, why it is important and should not usually contain all dependencies.
useEffect cleanups
I understand the importance of the cleanup functions for timeouts, intervals, async calls, event listereners and much more when introducing them inside useEffect hooks
Combining useState and useEffect
I can combining both useState and useEffect to create controlled components.
I know how I can update state after properties updates
I respect the principal rules of hooks:
They must be used only inside functional components
They must not be executed conditionally (no hooks inside if statements / arrays forEach looping etc.)
I know how to introduce state into the functional component
I know when to use plain values and when utilize callback functions as arguments
I can add effects to react to the changes of the observed variables.
I understand the concept of dependency array, why it is important and should not usually contain all dependencies.
I understand the importance of the cleanup functions for timeouts, intervals, async calls, event listereners and much more when introducing them inside useEffect hooks
I can combining both useState and useEffect to create controlled components.
I know how I can update state after properties updates