Liking Lifecycles in React

In todays exercise we are going to practice lifecycles for a functional and class component.

Step 01 - Create a like toggle button

✨ Requirements ✨

• When you click the button the class should toggle from 'default' to 'active
• So if a button is 'default' and is clicked it should now have an 'active' className and vice versa

Step 02 - Refactor into a like count

✨ Requirements ✨

• The like count displays the number of likes each student / teacher has.
• The starting like count should be a random number and is set when the component first mounts.
• When the button is clicked the like count should go up. The count should be set and stored in state.
• When clicked the button should have a class of "active" that after 500ms will be reset to "default"

Step 03 - Refactor with all the same requirements into a functional component.

• Meet all the same requirements as step 02 but now using a functional component.

How to work on it

Please (only) work on the file src/student.js.

You can open this repository in Codesandbox by going to the following link where you add your Github username at the end: https://codesandbox.io/s/github/redi-react-fall-2020/06-exercises-lifecycle-methods-YOUR_GITHUB_USERNAME

How to check your progress:

If you opened this repo in code-sandbox, you can see in the app what is working and what not.

You can also open the console in Codesandbox to see the output of your functions.