Create il vostro sito di streaming video creando un'applicazione React.js personalizzata

Costruire un'applicazione di streaming video può sembrare scoraggiante all'inizio, ma questo video spiega come si può ottenere questo risultato. In particolare, dimostreremo come implementare un servizio di streaming con i seguenti componenti:

- Un'applicazione Node.js lato server che gestisce il recupero e lo streaming dei video, la generazione di miniature per i video e il servizio di didascalie e sottotitoli per i video.

- Un'applicazione client in React che consumerà i video sul nostro server. Questa applicazione avrà due visualizzazioni: un elenco dei video disponibili e una visualizzazione del lettore per ogni video.

Capitoli:
0:00 Introduzione
0:50 Prerequisiti
1:19 Creare le directory delle app
1:48 Eseguire npm init
2:04 Installare le dipendenze
2:15 Creare la directory delle risorse
2:34 Scaricare le risorse da Github
2:44 Aggiungere il primo video alle risorse
2:58 Creare app.js
5:48 Testare l'applicazione in Dev
6:17 Iniziare a lavorare sul frontend
8:27 Avviare l'applicazione React
8:55 Cosa c'è dopo?
9:13 Implementare Bootstrap
9:30 Installare react-router-dom
9:56 Creare la vista Home
14:18 Eseguire home.js
15:28 Creare la vista Player
18:21 Eseguire player.js
19:00 Apportare modifiche ad app.js
20:36 Legare le richieste del frontend al server
22:21 Legare i video al frontend
23:26 Creare le miniature dei video
25:11 Servire dinamicamente i video a pezzi
30:07 Ricapitolazione rapida
31:49 Installare FFMPEG
33:47 Aggiungere le didascalie
35:56 Creare un endpoint per le didascalie
36:58 Stile dell'applicazione
40:25 Creare i componenti di intestazione e piè di pagina
43:03 Conclusione

Nuovo su Linode? Iniziate qui con un credito di 100 dollari!
Leggete il documento per maggiori informazioni sulla distribuzione di un'applicazione di streaming video React.
Per saperne di più su React.
Scaricare FFMPEG qui.
Iscrivetevi per essere avvisati dei nuovi episodi non appena vengono pubblicati.

#Linode #React #Video #Streaming
Prodotto: Linode, Open Source, React; Sam Hawley;

Strumenti per gli sviluppatori