In this video I go over how to create this simple counter using React. I show you the full front end coding tutorial, where I create a React component and then write all of the styling and animation effects with CSS. I use Flexbox for the layout, and add hover and active states to improve the interaction. I also use conditional class statements with tertiary operators to change the styling of the counter depending on the value of the number.

Codepen: https://codepen.io/angeladelise/pen/zYKpRqE

In this video I show you:

• 0:00 - Intro
• 0:29 - Starting Code & Settings
• 1:11 - HTML Code
• 1:28 - React Code
• 4:45 - React Hook - useState
• 6:49 - onClick Event
• 8:40 - CSS Code
• 14:46 - Conditional Classes in React

#react