JSExpertHub Pre-processing videos on browsers - Semana JS Expert 8.0
HTML 27.05%CSS 24.14%JavaScript 48.81%
semana-javascript-expert08's Introduction
JSExpertHub Reimaging Video Upload - Semana JS Expert 8.0
Preview
Pre-reqs
Este projeto foi criado usando Node.js v18.17.0
O ideal é que você use o projeto em ambiente Unix (Linux). Se você estiver no Windows, é recomendado que use o Windows Subsystem Linux pois nas aulas são mostrados comandos Linux que possam não existir no Windows.
Running
Execute npm ci na pasta que contém o arquivo package.json para restaurar os pacotes
Execute npm start e em seguida vá para o seu navegador em http://localhost:3000 para visualizar a página acima
Checklist Features
Video Uploader
- Deve entender videos em formato MP4 mesmo se não estiverem fragmentados
- Deve processar itens em threads isoladas com Web Workers
- Deve converter fragmentos de videos em formato 144p
- Deve renderizar frames em tempo real em elemento canvas
- Deve gerar arquivos WebM a partir de fragmentos
Desafios
- Encodar em 360p e 720p
- Fazer encoding/decoding track de áudio
- Fazer também upload de track de áudio
- Concatenar o arquivo final no servidor em um arquivo só
- Corrigir problema do Webm de não mostrar a duração do video
browser-sync está lançando erros no Windows e nunca inicializa:
Solução: Trocar o browser-sync pelo http-server.
instale o http-server com npm i -D http-server
no package.json apague todo o comando do browser-sync e substitua por npx http-server .
agora o projeto vai estar executando na :8080 então vá no navegador e tente acessar o http://localhost:8080/
A unica coisa, é que o projeto não vai reiniciar quando voce alterar algum código, vai precisar dar um F5 na página toda vez que alterar algo