React Custom Hooks (Advanced)
Explore building custom React hooks by combining useState and useEffect to create reusable logic that manages state synchronized with local storage. Understand how to pass parameters like keys and initial state to improve flexibility and prevent data overwrites. This lesson helps you encapsulate complex behavior away from components for cleaner code and better reusability.
We'll cover the following...
Thus far we’ve covered the two most popular hooks in React: useState and useEffect. useState is used to make your application interactive; useEffect is used to opt into the lifecycle of your components.
We’ll eventually cover more hooks that come with React – though we won’t cover all of them here. Next, we’ll tackle React custom Hooks; that is, building a hook yourself.
We will use the two hooks we already possess to create a new custom hook called useSemiPersistentState, named as such because it manages state yet synchronizes with the local storage. It’s not fully persistent because clearing the local storage of the browser deletes relevant data for this application. Start ...