React: Advanced Code Challenges

Course details

The course aims to take your React knowledge and skills to the next level with advanced concepts, strategies, and methods through hands-on practice. It is designed to help you acquire the advanced best practices and industry standards. Instructor Sandy Ludosky cover topics such as state updates and re-renders, advanced state management patterns, React lifecycle and data fetching, React.memo memoization, diffing and reconciliation, and debouncing and throttling.

Learning objectives
Learn to fix performance and configuration issues using composition and memoization techniques.
Learn to make the app performant-optimized, easy to maintain and highly scalable.
Identify the React bottlenecks and learn how to overcome them.
Master the state management strategies and best practices.

Concepts

0. Introduction

01 - Advanced code challenges in React
02 - What you should know
03 - Setup and tooling
04 - How to use CoderPad

1. Thinking in React - State Updates and Rerenders

05 - Your React app is slow, so what now
06 - Nested components or passing props
07 - Avoiding unnecessary rerenders
08 - How to easily identify React bottlenecks

2. Managing Component Configuration and Lifecycle

09 - Preventing useEffect infinite loop
10 - Overcoming the cons of useEffect

3. Memoization in React - How and When

11 - How to maximize performance
12 - Avoiding expensive computations

4. Advanced React Patterns

13 - Overcoming the props drilling pitfall
14 - Lifting up the state with context API - How
15 - useReducer - Managing multiple states
16 - Separating logic with the hooks pattern

5. React Lifecycle and Data Fetching

17 - Where to fetch data in React
18 - Using useEffect to connect to an external system

6. Debouncing and Throttling

19 - Handling errors with ErrorBoundary

Conclusion

20 - Next steps