Apply What You Learned

Apply your knowledge about custom Hooks.

Activity 11.1: Build a Custom Keyboard Input Hook

In this activity, your task is to refactor a provided component such that it's leaner and no longer contains any state or side-effect logic. Instead, you should create a custom Hook that contains that logic. This Hook could then potentially be used in other areas of the React application as well.

Note

You can find the starting code for this activity at https://packt.link/rdwd9. When downloading this code, you'll always download the entire repository. Make sure to then navigate to the subfolder with the starting code (activities/practice-1/starting-code, in this case) to use the right code snapshot.

The provided project also uses many features covered in earlier chapters. Take your time to analyze it and understand the provided code. This is a great practice and allows you to see many key concepts in action.

Once you have downloaded the code and...