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

Neste vídeo, @CodeWithHarry ensina-nos a criar um sítio Web de transmissão de vídeo utilizando 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 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 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 para código React
13:15 Remover código do ChatGPT
13:36 Alterar 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 Ficheiros
22:30 Criar Módulo Assistir Vídeos
23:45 Criar Object Storage Bucket no Linode
25:00 Criar React File Uploader
26:25 Criar API
28:15 Teste API
30:10 Instalar Formidable e S3-SDK
30:30 Compilar upload.js
32:10 Desabilite o bodyparser no next.js
32:50 Utilize o Formidable para analisar formulários
36:20 QA upload.js
39:20 Criar list.js
43:12 Conectar ao Front End
44:20 Preencher a página de visualização com cartões de vídeo
49:10 Conectar a página de upload a API
55:00 Corrigir o tamanho máximo do ficheiro a carregar
56:00 Exibir vídeos carregados na página de exibição
1:03:50 Criar player na página de exibição
1:10:50 Carregar 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 $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 eles forem lançados.

#VideoStreaming #objectstorage #codewithharry
Produtos: Linode, Object Storage, Video Streaming; @CodeWithHarry

Ferramentas do desenvolvedor