Predictable, easy to reason state management tool.
The code you clone down will have the functionality working as seen above.
Note that all components are defined in the same file (index.js). While this is not conventional, it will make our jobs a little easier as we begin to refactor to redux.
Take a look at the current component structure. App
renders a div with two children, Header
and Counter
. Using React (do not attempt to solve this problem using Redux yet), your goal is to make the changes described below without altering the current structure of which parent components render which child components.
- Remove the code that calculates and renders the line
The current count is less than <some number>
from theCounter
component. - Add that same description about the current count (feel free to use the same code) in the
Header
component in place of the text that currently says "Welcome to React"
When lecture begins be prepared to discuss and summarize what you had to do in order to implement this change and why you had to do it.
While this code is all written in the same file for demonstration purposes, your solution should follow normal React practices.