Cree su propio sitio de transmisión de vídeo mediante la creación de una aplicación React.js personalizada
Crear una aplicación de streaming de vídeo puede parecer complicado al principio, pero en este vídeo se explica cómo hacerlo. En concreto, veremos cómo implementar un servicio de transmisión con los siguientes componentes:
- Una aplicación del lado del servidor Node.js que se encargará de obtener y transmitir vídeos, generar miniaturas para sus vídeos y servir subtítulos para los mismos.
- Una aplicación cliente en React que consumirá los vídeos de nuestro servidor. Esta aplicación tendrá dos vistas: un listado de vídeos que están disponibles, y una vista de reproductor para cada vídeo.
Capítulos:
0: 00 Introducción
0: 50 Requisitos previos
1:19 Crear directorios de aplicaciones
1:48 Ejecutar npm init
2: 04 Instalar las dependencias
2:15 Crear el directorio de activos
2: 34 Descargar los activos de Github
2: 44 Añadir el primer vídeo a los activos
2: 58 Crear app.js
5:48 Probando la aplicación en el departamento de desarrollo
6: 17 Empezar a trabajar en el frontend
8: 27 Iniciar la aplicación React
8: 55 ¿Qué es lo siguiente?
9:13 Implementar Bootstrap
9: 30 Instalar react-router-dom
9: 56 Crear la vista de inicio
14: 18 Ejecutar home.js
15: 28 Crear la vista del reproductor
18: 21 Ejecución de player.js
19: 00 Realizar ajustes en app.js
20: 36 Vincular las peticiones del frontend al servidor
22: 21 Vincular los vídeos al frontend
23: 26 Crear miniaturas de vídeo
25:11 Servir dinámicamente los vídeos en trozos
30:07 Resumen rápido
31:49 Instalar FFMPEG
33: 47 Añadir subtítulos
35: 56 Crear un punto final de subtítulos
36: 58 Estilizar nuestra aplicación
40: 25 Crear componentes de cabecera y pie de página
43: 03 Conclusión
¿Es nuevo en Linode? ¡ Empieza aquí con un crédito de 100 $!
Lee el documento para obtener más información sobre la implementación de una aplicación React Video Streaming.
Más información sobre React.
Descarga FFMPEG aquí.
Suscríbete para recibir notificaciones de nuevos episodios.
#Linode #React #Video #Streaming
Producto: Linode, Código abierto, React; Sam Hawley;