Detectando usuário on-line e off-line com JavaScript Vanilla

Já teve curiosiade de como implementar uma detectação de usuários off-line e online em seu projeto web? É simples!

Aqui vai!

window.addEventListener("load", () => {

      window.addEventListener("online", () => {
  
      // sua lógica aqui
  
      });
      
      window.addEventListener("offline", () => {
  
      // sua lógica aqui
  
      });
    
});

Fácil, não é? Sim.

Sugiro que mantenham a lógica em funções, assim mais limpinho. Principalmente se for mexer na DOM!

No contexto mais usado, estaríamos enviando à partir de sockets para o back-end da aplicação esse dado, assim atualizando o status do usuário no banco de dados para que se possa 'globalizar' para outros usuários.

Recomendo que vejam a documentação do socket.io, é simples e de fácil implementação. (Filipe já gravou implementando, ein! 👀)

E esse foi meu primeiro de muitos posts! 🙌