How to Play Audio Clips on the Click of a Button in ReactJS

Поділитися
Вставка
  • Опубліковано 18 вер 2024

КОМЕНТАРІ • 63

  • @mrroy2460
    @mrroy2460 9 місяців тому +1

    Thanks a lot sir from India ❤ I m so kind of you I wish by my side for you God bless you 🎉🎉

  • @talben-zvi575
    @talben-zvi575 2 роки тому +2

    Bruh that's the only programming tutorial that ever made me laugh, gonna use this for a chess app

    • @arslan99
      @arslan99  2 роки тому +1

      Haha I'm glad you liked it. Good luck on your chess project

  • @tinna2941
    @tinna2941 3 роки тому +4

    omg the first audio file I tried to import was also bruh, before watching this video. Destiny is real.

    • @arslan99
      @arslan99  3 роки тому +1

      😳😳😳

    • @killer0200318
      @killer0200318 3 роки тому +1

      wait wtf that was also the first audio file i also tried to import even before watching the video

    • @arslan99
      @arslan99  3 роки тому +1

      @@killer0200318 😳😳😳

  • @tansys3017
    @tansys3017 2 роки тому +6

    Thanks so much, I’m redoing my calculator project from boot camp and I want it to quack like a duck when I get my total

    • @arslan99
      @arslan99  2 роки тому

      Haha that's awesome. Good luck with your bootcamp. And I'm glad this video helped you out!

  • @deveshsuryawanshi2021
    @deveshsuryawanshi2021 11 місяців тому +1

    Thank you so much man 🤩🤩🤩🤩😍

  • @noelbahthis8959
    @noelbahthis8959 2 роки тому +1

    this video helps a lot, thanks man😄

  • @yasser.dev7
    @yasser.dev7 4 роки тому +3

    Thanks , its very helpful

  • @rachidrezzik
    @rachidrezzik 3 роки тому +2

    great video, thanks for sharing

  • @yuriiserdiuk3918
    @yuriiserdiuk3918 4 роки тому +2

    thank's bro, this is awesome

    • @arslan99
      @arslan99  4 роки тому

      Np thanks for watching!

  • @leeyahav4754
    @leeyahav4754 2 роки тому +1

    thnx a lot
    it was really helpful

  • @RoyerAdames
    @RoyerAdames 3 роки тому +1

    thank you

  • @nickc7039
    @nickc7039 3 роки тому +1

    Whats going on man? could you link or let me know what hardware i would need to make physical buttons and play through a speaker. Appreciate it. Liked and subscribed

    • @arslan99
      @arslan99  3 роки тому

      Physical buttons I honestly have no idea 😔

  • @olusolaakindoju3811
    @olusolaakindoju3811 3 роки тому +1

    "That's what she said"

  • @MohitSingh-qd5sn
    @MohitSingh-qd5sn Рік тому +1

    That's what she said 😂😂

  • @hiphopheaven
    @hiphopheaven 2 роки тому +1

    have any idea how to play mp3 that are storage in internal storage and sd card ?

    • @arslan99
      @arslan99  2 роки тому

      You'd have to import it into your project or import it from your storage directory that's all I could think of 🤔

  • @HimanshuSharma-pz9gv
    @HimanshuSharma-pz9gv 2 роки тому +1

    hello there, i tried this method, but it is saying the promise error (being rejected) into the console, and giving me Unsupported, code 9....Also my import statement to the sound directory is also displaying error as "cannot find module named sound.mp3" eventhough my address is correct and so its extention.

    • @arslan99
      @arslan99  2 роки тому

      Unfortunately I'm not sure as I haven't delt with this package for a while

  • @sravyakolli7098
    @sravyakolli7098 2 роки тому +1

    hey ur video was very useful for our project ..! thanks soo much ..! Do UK how we can play the sound on loop until we press the button again ..?

    • @arslan99
      @arslan99  2 роки тому

      Like this
      var sound = new Howl({
      src: ['sound.webm', 'sound.mp3', 'sound.wav'],
      autoplay: true,
      loop: true,
      volume: 0.5,
      onend: function() {
      console.log('Finished!');
      }
      });

  • @daccu8633
    @daccu8633 4 роки тому +2

    could you give a demo to use the Howler.js library where the source of the Howl from a url on web instead of from a local machine? Not sure if this library could do it? Thanks for sharing your stuff. deeply appreciate it

    • @arslan99
      @arslan99  4 роки тому +1

      Hey Dac. Good question, I'm not sure if it's possible but I'll see if I can give it a try and make a tutorial showing how to do it in the next couple days.

    • @daccu8633
      @daccu8633 4 роки тому +1

      awesome@@arslan99! I would love to see your next demo. thanks for taking the time to share it with us.

    • @arslan99
      @arslan99  4 роки тому +1

      ua-cam.com/video/ZYy8w5QmdbM/v-deo.html
      Hope this helps ya out!

  • @TheMcCLennon
    @TheMcCLennon 4 роки тому

    Great video. I can use this code to a movile app or is just in web?

    • @arslan99
      @arslan99  4 роки тому

      I don't think it would be compatible with react native (react for mobile) for example you would need to reformat it

  • @jasonruff1270
    @jasonruff1270 2 роки тому +1

    do i have to use howler to play audio in react js?

    • @arslan99
      @arslan99  2 роки тому

      I don't quite remember this tutorial but I think so 🤔 sorry I couldn't be clearer

  • @owl2464
    @owl2464 3 роки тому +2

    And how can I make it stop playing if I click again on the button?

    • @arslan99
      @arslan99  Рік тому +1

      github.com/goldfire/howler.js/issues/1182

    • @owl2464
      @owl2464 Рік тому +1

      @@arslan99 thank you

    • @arslan99
      @arslan99  Рік тому

      @@owl2464 sorry that response took a year I am responding too all the comments UA-cam just showed me 🫡

    • @owl2464
      @owl2464 Рік тому +1

      @@arslan99 No problem. I am happy that you replied. 🤗☺ Keep up that good work👍

  • @safaaouaazzan6861
    @safaaouaazzan6861 3 роки тому +1

    how to know the position of the audio when playing?

    • @arslan99
      @arslan99  3 роки тому +1

      Sorry I'm not sure what you mean? What position do you mean?

    • @safaaouaazzan6861
      @safaaouaazzan6861 3 роки тому +1

      @@arslan99 I want to get position of the audio when I press play (the position in milliseconds)?

    • @arslan99
      @arslan99  3 роки тому +1

      Sorry to say but I'm not sure. Maybe try googling around ☺️

    • @safaaouaazzan6861
      @safaaouaazzan6861 3 роки тому

      @@arslan99 okay thank you

  • @abhishekkthakur1
    @abhishekkthakur1 4 роки тому

    It doesnt run when i upload it to my website after npm run build. Any idea?

    • @arslan99
      @arslan99  4 роки тому

      What error do you get?

  • @boulerice-archives
    @boulerice-archives 4 роки тому +1

    import Bruh from './Brotherhood'

  • @Hytension
    @Hytension 2 роки тому +1

    Bruh.mp4

  • @lakshmis5860
    @lakshmis5860 3 роки тому

    Please make a real chat application with sound notification please

    • @arslan99
      @arslan99  Рік тому

      Thats a good Idea maybe in the future