Front End Development Libraries Projects - Build a Drum Machine

Tell us what’s happening:

My current goal is to get the buttons to output a sound when pressed. Since it is helpful to focus on a simpler aspect of the system, I am trying to get the “Q” sound to work for now.

I am unsure how to incorporate the argument in an event handler function. I created a function called handleClick that takes in an audio sample and is intended to play that audio sample. I’ve tried to start simple, so I only incorporated the event handler function for the “Q” button, however I am unsure how to put in the “Q” sound as an argument for the handleClick function because my understanding is that, when we write something like onClick={handleClick}, we aren’t supposed to actually call the event handler function, ie it isn’t good practice to put in onClick={handleClick(https://s3.amazonaws.com/freecodecamp/drums/Chord_1.mp3)} for example. So when an argument passing to the event handler function is necessary, how is this generally implemented?

Also, more generally speaking, I’m wondering if anyone has a particular benchmark to use for determining when to ask for help when one is stuck. For this particular problem, I was stuck for about three months (came back to it everyday for about ten minutes), but I wasn’t sure when to stop trying to read documentation and when to just directly ask a question. If anyone has a heuristic that they use to make this judgment, I’d be very open to hearing about it.

Your code so far

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:121.0) Gecko/20100101 Firefox/121.0

Challenge Information:

Front End Development Libraries Projects - Build a Drum Machine

Try adding the following as the first line to the handleClick function:

console.log(audio_sample);

This will show you what is actually being passed into that function.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.