Exercises:
- Exercise 1: Lifting State Up
- By this time, you have
Counter.jsx and UserInfo.jsx
- Put the Counter
useState to App.jsx
- Pass the
setCounter function to Counter component
- Pass the
counter state to UserInfo.jsx
UserInfo component should use the counter state to show the age
- Exercise 2: Conditional Rendering
- Extend the
Counter.jsx component to include the following features:
- Use conditional rendering to hide the increment button if the count reaches a 10
- Render a reset button that becomes visible only when the count is 10. Clicking the reset button should set the count back to 0.
- Practice using both ternary operators and logical && operators for conditional rendering.