Compound Components Pattern - Manageable Styling for Reusable Components
Let’s style our expandable component in this lesson!
Props Collection - The Props Collection Pattern in Practice
Let’s apply the props collection pattern to our expandable component!
Props Collection - What is the Props Collection Pattern?
In this lesson, we’ll have a quick overview of the props collection pattern!
Introduction - What to Expect
Here’s a quick overview of what you’ll learn in this course!
Compound Components Pattern - Handling State Change Callbacks
In this lesson, we’ll learn how to use React hooks to handle state change callbacks.
State Initializer - Getting Rid of Extra State Variables
Let’s clean up the useExpanded.js file by removing extra state variables
Introduction - Why Use Advanced Patterns?`
Advanced patterns with hooks allow reusable React components to be incredibly flexible.
Compound Components Pattern - Custom Use of the Component
Not only have we made it beautiful, we’ve made it customizable as well.
Control Props - What are Control Props?
Here’s a quick overview of control props!
Prop Getters - Additional User Props
In this lesson, we’ll learn how users can pass additional props to prop getters!
Compound Components Pattern - What are Compound Components?
Compound components in React are components that are composed of two or more separate components.
Compound Components Pattern - Example: Building an Expandable Component
In this lesson, we will set up an expandable component that is based on the compound component pattern
Compound Components Pattern - Preventing Unnecessary Renders
Let’s optimize our code!
Compound Components Pattern - Keeping Value Constant
Have questions about Keeping Value Constant? Go for it!
Compound Components Pattern - Building the Compound Child Components
Now, let’s work on the Expandable component’s child components and actually see some output!
State Reducer - Cleanups
You finally made it! We’re almost done. Let’s clean a few things up.
Conclusion - Last Words
Thank you for taking this course! Good luck in your future React endeavors!
Prop Getters - What is the Prop Getters Pattern?
Here’s a quick overview of the prop getters pattern!
Compound Components Pattern - Custom Styling Options
We’ll now learn how to override default styles!
State Reducer - Updating Internal State
Let’s see how a user could choose to dictate how internal state is updated.
Control Props - How Control Props Work
In this lesson, we’ll make the Expandable component work so that the elements expand one at a time
Control Props - Using the Controlled Component
In this lesson, we’ll learn how a user would use a controlled component from an app!
State Reducer - What Is the State Reducer Pattern?
Let’s get started with the reducer pattern!
Control Props - Building a Custom Hook
In this lesson, you’ll learn how to create a custom hook!
Control Props - Providing Default UI Elements
We’ll now make our open source library more user-friendly and convenient by allowing export of default UI elements,
State Initializer - Resetting the State
Have questions about Resetting the State? Go for it!
State Initializer - What is the State Initialization Pattern?
Here’s a quick introduction to patterns in React with state initialization!
Prop Getters - Handling Props with the Same Property Name
In this lesson, we’ll see how two prop properties with the same name can be invoked at once.
Conclusion - Where to Go from Here?
Want to learn more about web development and React? I have a few other courses already on Educative! Have a look.
State Reducer - Implementing the State Reducer Pattern
Let’s integrate the state reducer pattern into the scenario we studied earlier
State Reducer - Refactoring to `useReducer`
Let’s modify our custom hook to use <code>useReducer</code> instead of <code>useState</code>.
State Reducer - The User’s Application
In this lesson, we’ll look at how our custom hook can be used in an application