Unidirectional Data Flow & Lifting State Up

Unidirectional Data Flow

In React, changes to state will be reflected in the UI by "flowing down" into components through props.

Lifting State Up

This unidirectional data flow means that when more than one component in our application needs access to state, that shared state needs to be moved up to the closest common ancestor. That ancestor can then pass down the state to the components that need it as props. This is called lifting state up.

Counter

Counter and OddOrEven need to share state

Lift count state up to App and pass it down as props