Home/Courses/React/React Components & Patterns

React Components & Patterns🧩

Intermediate→Advanced

React 19

Master advanced strategies for building reusable, performant, and robust React components. Learn modern composition patterns, ref handling, performance optimization, and error boundaries.

5

Sections

12

Lessons

19

Challenges

Start this free course

Start learning React Components & Patterns

12 lessons and 19 challenges, all 100% free.

Start this course

The Children Prop

The Slots Pattern

Render Props Pattern

Children Type(Sign in required)

Intermediate+10 Mana

Slots vs Children(Sign in required)

Intermediate+10 Mana

Render Prop Pattern(Sign in required)

Intermediate+10 Mana

Render Props vs Hooks(Sign in required)

Intermediate+10 Mana

Introduction to Compound Components

Advanced Compound Components

Compound Component State(Sign in required)

Intermediate+10 Mana

Context Safety(Sign in required)

Intermediate+10 Mana

Controlled vs Uncontrolled(Sign in required)

Intermediate+10 Mana

Refs in React 19

useImperativeHandle

Portals: Escaping the DOM

Refs in React 19(Sign in required)

Intermediate+10 Mana

useImperativeHandle Purpose(Sign in required)

Intermediate+10 Mana

Portal Target(Sign in required)

Beginner+10 Mana

Portal Event Bubbling(Sign in required)

Advanced+15 Mana

React.memo: Preventing Re-renders

List Rendering Optimization

memo Comparison(Sign in required)

Intermediate+10 Mana

Callbacks and memo(Sign in required)

Intermediate+10 Mana

Key Prop Purpose(Sign in required)

Beginner+10 Mana

List Virtualization(Sign in required)

Advanced+15 Mana

Error Boundaries

Error Handling Strategies

Error Boundary Type(Sign in required)

Intermediate+10 Mana

What Errors Are Caught(Sign in required)

Intermediate+10 Mana

Error Boundary Methods(Sign in required)

Advanced+15 Mana

Error Boundary Hook(Sign in required)

Intermediate+10 Mana

Ready to start this free course?

No credit card required.

Start this course now

Ready to start React Components & Patterns?

12 interactive lessons and 19 hands-on challenges — learn in VS Code, Cursor, or the web.