In this video, Amy explains what a hook is and how to set up a custom hook. Using her custom audio player as a starting point, she makes the code more reusable converting it to a custom hook library.
0:00 Introduction
1:31 Getting the Project Setup Locally
3:02 What is a Hook?
4:07 Creating our Custom Hook
18:07 Tidying up our code
19:13 Making our component more reusable
21:09 Prop Types and Defaults
⭐ MULTI-PART SERIES
Part 1 - Building a Custom Audio Player within React - • How to Build a Custom Audio Player in...
Part 2 - Debugging within VS Code - • Debugging Inside VS Code
Part 3 - Adding Chapters / Bookmarks - • Adding Bookmarks or Chapters to our C...
Part 4 - Adding Time Jumps - • Creating Time Jumps for our Custom Au...
Part 5 - When the player reaches the end... - • Adding a Feature: When the Audio Play...
Part 6 - Creating Custom Hooks = YOU ARE HERE
Part 7 - Creating a Custom npm package
Part 8 - Adding an Audio Waveform Image
Part 9 - Handling Multiple Audio Players on the Page
Part 10 - Handing off to a Persistent Player
🤩 GIST of Personal Snippets - https://gist.github.com/ahaywood/fdfb...
🏁 STARTING POINT
GitHub - https://github.com/selfteachme/0050-e...
🤖 FINAL CODE
GitHub - https://github.com/selfteachme/0051-a...
🔗 LINKS
Next.js Router Documentation - https://nextjs.org/docs/api-reference...
👉🏻 Get Updates and Exclusive content at http://selfteach.me
💥 SelfTeach.me is a Zeal show: http://codingzeal.com