Criando Player de Áudio com Javascript | Mayk Brito




Fala Dev! Beleza??

No vídeo de hoje vamos aprender a usar a tag audio do html5, criando um player de áudio, simulando um podcast player, com JavaScript puro e utilizando materialize como framework css.

Aprenderemos como manipular a dom e funcionalidades básicas de um player de áudio.

Vai ser uma experiência incrível!

Bora codar!

Repositório: https://github.com/Rocketseat/youtube-html-js-audio-player

—–

Acompanhe a Rocketseat nas redes sociais:
Site: https://www.rocketseat.com.br
Twitter: https://www.twitter.com/rocketseat
Facebook: https://www.facebook.com/rocketseat
Instagram: https://www.instagram.com/rocketseat_oficial
Comunidade: http://comunidade.rocketseat.com.br
Blog: https://rocketseat.com.br/blog

Original source


35 responses to “Criando Player de Áudio com Javascript | Mayk Brito”

  1. Obrigado pelo seu conteudo é muito bom! Más tenho umas questões? Se puder me ajudar agradeceria tanto… Como organizar os dados json vindo de Banco de dados (MySQL, PHP) de forma a ter uma estrutura igual ao seu como "title, song, type… etc"? Outra é possivel ter o audio player tocando no background sem interferença de nenhum refresh page, nesse caso ao trocar de pagina nao pode parar a musica?

  2. Opa Mayk Brito blz cara eu sou iniciante ainda com javascript e eu tou querendo fazer um menu que quando você clica no link ele fica ativo com uma cor diferente você pode me ajudar a fazer isso fico muinto agradecido

  3. um video sobre como procurar emprego sendo junior seria uma boa em e quando saber se vc já é apto pra tentar uma vaga de pleno, to procurando vaga junior e ta impossivel as vagas de junior assustam muito com o que pedem, pedem ate typescript e ta pedindo mesmo não é "seria bom se voce soubesse"

  4. Muito bom! Valeu por essa aula. Eu como trabalho muito durante a semana, fui fazendo um pouco cada dia. Finalizei hoje. Foi ótimo pra treinar vários conceitos e me manter codando todo o dia um pouquinho.

  5. Descobri coisa novas: no box-shadow, por exemplo, eu sempre uso deslocamento X, Y e Espalhamento… Esse outro aí eu não sabia que tinha não kkkkk… Outra coisa que eu nunca faço é colocar display flex no body… Será que é por isso que eu tenho dificuldade na hora de centralizar os meu objetos??? Vou usar muita coisa que eu vi aqui neste vídeos nos meus códigos a partir de agora. Muito obrigado pelas dicas!!!

  6. Olá gostaria muito saber como criar app para ambulância igual uber só que ambulância a pessoa solicita cadastra num formulário quem tiver disponível e estiver com todos requisitos combina o transporte e inicia a corrida até pessoa e da pessoa até local indicado pela pessoa trabalho ambulância BR040 e fora plantão faço transportes gostaria muito de ter uma função assim profissional e tenho conhecimentos programação e setor ti

  7. Muito bom!! Para ficar show faltou corrigir 2 coisas:
    1. o update() que ficou sendo chamado 2x dentro no metodo next(); colocar um "return" dentro do if para encerrar a execução.
    2. O ícone de mute é "volume_mute" e não "volume_down"

Leave a Reply