Reprodutor de vídeo React

O streaming de entretenimento é um grande interesse meu, tanto como consumidor quanto como desenvolvedor da Web. Minha paixão por streaming de entretenimento remonta aos primeiros dias do RealPlayer e à miséria de um milhão de codecs. Hoje, estou trabalhando muito com o ReactJS, bem como com dezenas de tecnologias de streaming, como YouTube, Twitch, Facebook e assim por diante. Isso me levou a pensar: existe um bom componente de código aberto para incorporar vídeos de provedores de vídeo populares?

Vamos dar uma olhada no ReactPlayer, um componente de player de streaming de vídeo muito simples, mas útil, para o ReactJS!

Usar o componente ReactPlayer é muito simples:

import ReactPlayer from 'react-player';

class App extends Component {
  render() {
    return (
      <div>
        <ReactPlayer
          url="https://www.youtube.com/watch?v=rnwlWn603g4"
          className="react-player"
          playing
          width="100%"
          height="100%"
        />
      </div>
    );
  }
}

O ReactPlayer fornece um número de opções para reprodução geral e específica do serviço, fornecendo também vários retornos de chamada de eventos e até mesmo opções de reprodução de várias fontes.

O ReactPlayer é um utilitário incrível para incorporar fontes de mídia populares em seu próprio site. A configuração é mínima e o senhor pode ter qualquer serviço de vídeo instalado e funcionando em poucos minutos.