Aplicações Real-time com Phoenix LiveView

Slides usados no minicurso da Softweek 2025 na faculdade Campo real

Transcript

1. Aplicações real-time com Phoenix LiveView
2. Alessandro Dias 12 anos trabalhando com desenvolvimento web Trabalhei na Codeminer de 2014 até 2024
3. Anos 90 • Era tudo mato • A internet estava começando • Sites estáticos • Conexões HTTP não eram persistentes • Navegar entre páginas em sites era lento • One piece começa • Ajax é proposto
5. Anos 2000 • Server-sent events • Surge o HTML5 • Surge Websockets • Surge o HTTP2 • Elixir é criado (2012) • Phoenix é criado (2014) • Phoenix LiveView é criado (2019)
6. O que é uma aplicação real time? É uma aplicação em que as informações são entregues da maneira mais rápida possível. Exemplo: • WhatsApp • Notificações do Ifood • Google docs • Twitch
7. Técnicas para replicar comportamento realtime
8. Pooling Long Pooling Server-Sent Events (SSE) Websockets
11. Phoenix LiveView é uma biblioteca que fornece experiência de usuário realtime com renderização do lado do servidor, através de comunicação via WebSocket, necessitando de mínima escrita de Javascript e nenhuma em alguns casos.
12. message: search params: "text to search"
13. message: search params: "text to search" json {.....}
14. Vamos ao código
15. https://github.com/adbatista/Sofweek2025
16. Rode os comandos mix setup mix phx.server
17. Abra o navegador http://localhost:4000/
18. Tela do Chat
19. Template do chat
21. Tratando os eventos
24. Atualizando as janelas de todos usuários ativos no chat
30. Obrigado LinkedIn adbatista.github.io