Chapter 7 : Enhancing Components with Hooks

Samples

useEffect hook

• Blocking Alert Call - (run it);

• Unreachable Code - (run it);

• The useEffect hook - (run it);

The Dependency Array

• Too many effects - (run it)

• Effect Dependencies - (run it)

• Any Key to Render - (run it)

• Array Dependency issue - (run it)

• useMemo - (run it)

• Function Dependency issue - (run it)

• useCallback - (run it)

When to useLayoutEffect

• Basic useLayoutEffect - (run it)
• Custom: useWindowSize - (run it)
• Custom: useMousePosition - (run it)

useReducer

• Checkbox with useState - (run it)
• Checkbox with toggle - (run it)
• Checkbox with useReducer - (run it)
• Increment number with useReducer - (run it)

useReducer to handle Complex State

• useState with objects - (run it)
• useReducer with objects - (run it)
• legacy setState with useReducer - (run it)