Crie o seu próprio site de streaming de vídeo criando uma app personalizada React.js
Construir uma app de streaming de vídeo pode parecer assustador no início, mas este vídeo irá quebrar a forma como isto pode ser conseguido. Especificamente, iremos demonstrar como implementar um serviço de streaming com os componentes seguintes:
- Uma aplicação do lado do servidor Node.js que tratará de buscar e transmitir vídeos, gerando miniaturas para os seus vídeos, e servindo legendas e legendas para vídeos.
- Uma aplicação cliente em React que irá consumir os vídeos no nosso servidor. Esta aplicação terá duas visualizações: uma listagem de vídeos que estão disponíveis, e uma visualização do leitor para cada vídeo.
Capítulos:
0:00 Introdução
0:50 Pré-requisitos
1:19 Criar directórios de aplicações
1:48 Correr npm init
2:04 Instalar Dependências
2:15 Criar o Directório de Bens
2:34 Descarregar os bens de Github
2:44 Adicionar o Primeiro Vídeo ao Património
2:58 Criar app.js
5:48 Testar a aplicação em Dev
6:17 Começar os trabalhos na Frente
8:27 Iniciar a aplicação da Reacção
8:55 O que se segue?
9:13 Implementar Bootstrap
9:30 Instalar o reactor-router-dom
9:56 Criar a Vista de Casa
14:18 Running Through home.js
15:28 Criar a Vista do Jogador
18:21 Running Through player.js
19:00 Fazer Ajustes ao app.js
20:36 Pedidos de Frontend de Gravata para o Servidor
22:21 Vídeos de Gravata para a Frente
23:26 Criar miniaturas de vídeo
25:11 Servir Dinamicamente Vídeos em Pedaços
30:07 Recapitulação rápida
31:49 Instalar FFMPEG
33:47 Acrescentar legendas
35:56 Criar um ponto final em forma de legenda
36:58 Estilo A nossa aplicação
40:25 Criar Componentes de Cabeçalho e Rodapés
43:03 Conclusão
Novo na Linode? Comece aqui com um crédito de $100!
Leia o documento para obter mais informações sobre a implantação de um aplicativo de streaming de vídeo React.
Saiba mais sobre o React.
Faça o download do FFMPEG aqui.
Inscreva-se para ser notificado sobre novos episódios assim que eles forem lançados.
#Linode #Reagir #Video #Fluxo
Produto: Linode, Open Source, React; Sam Hawley;