Creating a Toggle for Playing and Pausing the Audio

We Introduce MDN Media docs and all the APIs.

In this lesson, we added the useRef and created an audioRef in our components. We also added the ref to the audio element to control it outside of the audio element. We use the useState hook, and we created an isPlaying state. And finally, we added a button that dynamically renders the text as pause and play depending on the isPlaying state. On click of that button, we toggle the isPlaying state, and depending on that state, we either pause or play it.