Criando uma tabela em HTML dinâmica usando atualização em tempo real com Firebase

No texto anterior, foi feito um Hello World utilizando Firebase Realtime Database com sua aplicação web. Que tal agora brincar com esse recurso? :)

Vamos supor que você tem que desenvolver uma solução para um professor que quer agradar seus alunos super tecnológicos e oferecer para eles uma aplicação web para eles acompanharem em tempo real o lançamento das notas, sem a necessidade de ficar apertando F5 ansiosamente.

Um caso bem bom pro Firebase Realtime Database, né?

Você pode baixar o projeto completo AQUI.

O segredo está todo no arquivo firebase.js:

Temos duas referencias a dois child diferentes: um para o texto no cabeçalho da página (dbBigTextEvaluationStudentsRef) e outra para o conteúdo da tabela (dbEvaluationStudentsRef).

Sempre que existir uma atualização no dbEvaluationStudentsRef, os dados antigos serão removidos e as novas linhas serão inseridas com os valores recebidos do Firebase.

Prático, né? ;)