Construa sua própria plataforma de streaming de vídeo | É mais fácil do que você poderia pensar!

Neste vídeo, @CodeWithHarry nos ensina a criar um site de streaming de vídeo usando HTML, CSS e next.js. Ele também explica como usar o Linode Object Storage para armazenar vídeos e transmitir vídeos diretamente do Object Storage Bucket para o nosso navegador usando HTML, CSS e Javascript.

Capítulos:
0:00 O que faremos neste vídeo
0:30 Criar o projeto next.js
1:38 Adicionar CSS do Tailwind ao projeto next.js
5:08 Criar componente de barra de navegação
7:00 Use o chatGPT para codificar a barra de navegação
7:40 Construir a base da barra de navegação
10:00 Converter código do ChatGPT em código React
13:15 Remover o código do ChatGPT
13:36 Alterar o texto da barra de navegação
14:30 Criar watch.js
16:30 Criar módulo de upload de vídeo
20:00 Criar tag de upload de arquivo
22:30 Criar módulo de assistir vídeos
23:45 Criar Object Storage Bucket no Linode
25:00 Criar o React File Uploader
26:25 Criar API
28:15 Teste API
30:10 Instalar o Formidable e o S3-SDK
30:30 Compilar o upload.js
32:10 Desativar o bodyparser no next.js
32:50 Utilizar o Formidable para analisar formulários
36:20 Controle de qualidade do upload.js
39:20 Criar list.js
43:12 Conectar-se ao front-end
44:20 Preencher a página Watch com cartões de vídeo
49:10 Conectar a página de upload ao API
55:00 Corrigir o tamanho máximo do arquivo de upload
56:00 Exibir vídeos carregados na Watch Page
1:03:50 Criar player na página de exibição
1:10:50 Fazer upload e testar o player
1:14:40 Mudar o botão de download para um ícone
1:16:50 Conclusão

Novo na Linode? Comece aqui com um crédito de US$ 100!
Saiba mais sobre o streaming de vídeo na Linode.
Assista a outro tutorial de aplicativo de streaming de vídeo.
Inscreva-se para ser notificado sobre novos episódios assim que forem lançados.

#VideoStreaming #objectstorage #codewithharry
Produtos: Linode, Object Storage, streaming de vídeo; @CodeWithHarry

Ferramentas para desenvolvedores