YoVDO

React Class Component Patterns

Offered By: egghead.io

Tags

React Courses Web Development Courses React Context Courses Higher-Order Components Courses

Course Description

Overview

Once you’ve nailed the fundamentals of React, that’s when things get really fun.
This course teaches you advanced patterns in React that you can use to make components that are simple, flexible, and enjoyable to work with.
You'll start with a simple component that you'll progressively refactor to each of the patterns. Throughout the course, you’ll see the benefits of each pattern and how they can be mixed-and-matched to make your components more useful (and simple for everyone who comes across them).
Kent C. Dodds has built and shipped components using each of these patterns. Along the way, he will help you understand and weigh the trade-offs of each pattern so you’ll intuitively know where to apply each of them in your own components.
You’ll finish the course with a list of actionable things you can do, right away, to rework the components that you're building. You’ll complete the course more knowledgeable about React components and equipped to make your components more simple.
Note: This course covers class component patterns and is still interesting and valuable for the serious React developer, but for most current apps you'll probably want to use React Hooks.

Syllabus

  • Course Overview: Advanced React Component Patterns
  • Build a Toggle Component
  • Write Compound Components
  • Make Compound React Components Flexible
  • Validate Compound Component Context Consumers
  • Prevent Unnecessary Rerenders of Compound Components using React Context
  • Use Render Props with React
  • Use Prop Collections with Render Props
  • Use Prop Getters with Render Props
  • Use Component State Initializers
  • Implement Component State Reducers
  • Improve the usability of Component State Reducers with state change types
  • Make Controlled React Components with Control Props
  • Support Control Props for all state
  • Support a state change handler for all control props
  • Improve the usability of Control Props with state change types
  • Implement the Provider Pattern with React Context
  • Implement a Higher Order Component

Taught by

Kent C. Dodds

Related Courses

Advanced React
Meta via Coursera
React المتقدم
Meta via Coursera
React avanzado
Meta via Coursera
Build Your First Production Quality React App
egghead.io
Building a Meditation App with React Native and Expo Router
freeCodeCamp