/streaming-netflix-bandersnatch

Streaming engine based on Netflix's Bandersnatch. (built during JS Expert Week <https://javascriptexpert.com.br/>)

Primary LanguageJavaScript

js-streaming-netflix-bandersnatch

Acesse https://bandersnatch.myreli.vercel.app/.

Implementação JavaScript de uma ferramenta de streaming baseada no filme interativo Black Mirror: Bandersnatch da Netflix:

  • Streaming se adapta a diferentes velocidades de conexão
  • Streaming interativo a partir de escolhas do usuário
  • Download de vídeo em fragmentos (chunks)

Desenvolvimento

Se estiver o Docker na sua máquina, basta utilizar o container de desenvolvimento. Para isso, basta abrir o projeto no VSCode, instalar as extensões recomendadas e iniciar o projeto. (Recomendado)

Se não, é necessário configurar o ambiente.

Iniciar

# gerar os arquivos nas resoluções necessárias
sh script.sh

# iniciar os servidores de desenvolvimento
npm run dev

Acesse http://localhost:8080.

Configurar o ambiente

Se não for utilizar o container de desenvolvimento, é necessário fazer a configuração local de acordo com o seu sistema operacional:

Mac ou Linux

# instalar as dependencias de renderização de vídeo
apt-get install --no-install-recommends ffmpeg gpac

# instalar as dependencias
npm install

# gerar os arquivos nas resoluções necessárias
sh script.sh

Windows

O melhor é usar WSL, mas também é possível instalar de forma nativa:

# instalar as dependencias de renderização de vídeo
choco install ffmpeg gpac

# instalar as dependencias
npm install

# execute no git bash ou outro terminal com comandos unix
./script.sh

Deploy

Por padrão, o deploy é feito no Vercel, através dos comandos: npm run deploy para subir a aplicação e npm run deploy:assets para subir as mídias na CDN.

Ao executar pela primeira vez, será solicitado o login no vercel, então é necessário criar uma conta.

Páginas

Lista de Títulos

página inicial

Vídeo

página do vídeo

TODO

  • Refatorar para tentar usar DASH

Créditos