Creating Time Jumps for our Custom Audio Player in React

Published: 08 July 2021
on channel: Self Teach Me
1,915
48

In this video, Amy adds Time Jumps to the custom audio player she's been building in React. This allows the user to click on a specific link that will automatically jump the play head to that point in the audio and auto-play.

0:00 Introduction
1:15 Getting the Project Up and Running on Your Machine
1:47 How this needs to work
3:24 Grabbing content from our URL with Next.js Router
6:01 Writing Reusable Code
6:13 Reusing our Code from the Forward and Backward 30 Buttons
7:20 Auto-Playing our Audio File
10:03 Refactoring our code
11:22 Sponsor: ZEAL

💥 ZEAL IS HIRING 💥
http://softwareresidency.com/zeal

⭐ 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 = YOU ARE HERE
Part 5 - When the player reaches the end...
Part 6 - Creating Custom Hooks
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

🏁 STARTING POINT
GitHub - https://github.com/selfteachme/0048-a...

🤖 FINAL CODE
GitHub - https://github.com/selfteachme/0049-t...

🔗 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


Watch video Creating Time Jumps for our Custom Audio Player in React online without registration, duration hours minute second in high quality. This video was added by user Self Teach Me 08 July 2021, don't forget to share it with your friends and acquaintances, it has been viewed on our site 1,91 once and liked it 4 people.