Let’s learn our first programming pattern!
In this lesson, we’ll take a look at a simple version of a programming pattern. The following lessons will expand upon that lesson, and by the end, we’ll have a programming pattern in its full complexity.
Our programming pattern uses two React components: a stateful component, and a stateless component. “Stateful” describes any component that has a state property; “stateless” describes any component that does not.
In our pattern, a stateful component passes its state down to a stateless component.
Click “Next” to go to the next exercise and walk through an example!
Instructions
In this video, in the “Before” scene, the user interface is defined by a single, complex component.
In the “After” scene, the user interface is defined by a clear hierarchy of components in which the stateful component, Post, passes state information to stateless components, like User info, Content, and Stats.