ANÚNCIO

Aula 22 – Vibe Coding: Implementando um sistema de Gestão de Mudancas

Aprenda a implementar notificações em tempo real com SSE, JWT e integração Java Quarkus + Angular nessa aula prática.

⏱ 2h 06min 👁 221 visualizações 📅 setembro 2, 2025

Resumo

O que é Server-Sent Events e por que usar

Server-Sent Events (SSE) é um protocolo nativo da web que permite ao servidor enviar notificações em tempo real ao cliente através de uma conexão HTTP persistente. Diferentemente de WebSockets, SSE usa apenas HTTP padrão e é ideal para cenários unidirecionais, onde o servidor precisa empurrar dados para múltiplos clientes sem que eles façam requisições constantemente. Nesta aula prática, o desenvolvimento de um sistema real de gestão de mudanças demonstra como implementar SSE com autenticação segura, integrando um backend robusto em Java com um frontend responsivo em Angular.

Implementação do SSE no Quarkus

O framework Quarkus, baseado em Jakarta EE, oferece suporte nativo para SSE através de seus componentes CDI (Contexts and Dependency Injection) e JPA para persistência. A implementação envolve criar um endpoint REST que retorna um tipo de mídia específico (text/event-stream) e manter a conexão aberta enquanto envia eventos serializado como JSON. Victor Osório caminha passo a passo pela criação de um controlador que gerencia conexões simultâneas de múltiplos clientes, utilizando uma estrutura de broadcast para notificar todos os inscritos quando uma mudança ocorre no sistema. O código demonstra boas práticas de inicialização, fechamento e tratamento de exceções em tempo real.

Autenticação JWT e segurança nos endpoints SSE

Um dos desafios críticos ao implementar SSE é garantir que apenas usuários autenticados recebam notificações. O vídeo aborda a integração de JSON Web Tokens (JWT) como mecanismo de segurança, validando o token antes de estabelecer a conexão com o cliente. A implementação inclui validação de headers, gerenciamento de sessões e discussão sobre como manter a segurança sem comprometer a performance. Victor explora configurações de CORS (Cross-Origin Resource Sharing), tratamento de erros de autenticação expirada durante a conexão aberta e como recuperar graciosamente quando um token se torna inválido após a conexão estar estabelecida.

Integração frontend em Angular

No lado do cliente, Angular precisa se conectar ao endpoint SSE e processar os eventos chegando em tempo real. A aula demonstra como criar um serviço Angular que encapsula a lógica de conexão, usando a API EventSource nativa do navegador. O serviço trata eventos, manage reconexões automáticas e fornece observáveis RxJS para que componentes se inscrevam nas mudanças. Discussões práticas cobrem tratamento de desconexões, retry logic com backoff exponencial e como sincronizar o estado do aplicativo quando novas notificações chegam. O código resultante é limpo, testável e segue padrões arquiteturais modernos do Angular.

Debug ao vivo e resolução de problemas

Um diferencial desta aula é o debug em tempo real, mostrando erros reais que ocorrem durante o desenvolvimento. Victor enfrenta problemas como CORS misconfigured, headers de autenticação incorretos, timeout de conexão no servidor e comportamentos inesperados do navegador ao manter conexões abertas por longos períodos. Cada erro é diagnosticado sistematicamente através de ferramentas de desenvolvimento, logs e compreensão profunda do protocolo HTTP. Essa abordagem honesta ensina não apenas a solução final, mas o processo mental de debugging que desenvolvedores experientes usam quando algo não funciona como esperado.

Mitos sobre Clean Code e simplicidade necessária

Víctor questiona dogmaticamente seguir regras de Clean Code sem considerar o contexto real do projeto. Ele argumenta que aplicar princípios como Single Responsibility Principle (SRP) ou excessiva abstração pode aumentar complexidade desnecessariamente. A aula demonstra cenários onde código mais simples e direto é superior a implementações "perfeitas" segundo manuais de design patterns. Essa discussão equilibrada prepara desenvolvedores para tomar decisões informadas sobre quando abstrair, quando simplificar e como não se deixar levar por purismo de código que prejudique manutenibilidade real.

Boas práticas em testes e manutenção

Além da implementação funcional, a aula cobre estratégias de teste para sistemas SSE, que apresentam desafios únicos por sua natureza assíncrona. Victor demonstra como testar a autenticação, a entrega de mensagens, comportamento em desconexões e sincronização entre clientes. A manutenção de código que manipula conexões abertas exige monitoramento cuidadoso de memory leaks, vazamento de recursos e degradação de performance sob carga. A aula fornece orientações práticas sobre logging apropriado, métricas de monitoramento e como estruturar o código para facilitar debugging futuro quando problemas emergirem em produção.

Estrutura e organização do código

O projeto morpho-board, disponível no GitHub, exemplifica uma organização profissional com separação clara entre camadas: controladores REST, serviços de notificação, repositórios JPA e DTOs para transferência de dados. O backend usa CDI para injeção de dependências, eliminando acoplamento entre componentes. O frontend estrutura serviços, interceptadores HTTP para autenticação automática e componentes que se inscrevem reativamente em mudanças. Essa estrutura escalável serve como referência para projetos reais, mostrando como evitar armadilhas comuns e manter código que évolui com requisitos do negócio.

O que você vai aprender

  • Implementar notificações em tempo real com Server-Sent Events (SSE)
  • Autenticar e proteger endpoints SSE usando JWT
  • Integrar backend Quarkus com frontend Angular
  • Debugar problemas reais de CORS, autenticação e conexão
  • Aplicar boas práticas de teste e manutenção em sistemas assíncronos
  • Questionar dogmas de Clean Code e tomar decisões contextualizadas

Conceitos abordados

Tecnologias utilizadas

Capítulos 10 marcações

  1. Introdução e objetivos da aula
  2. O que é Server-Sent Events e casos de uso
  3. Configuração do projeto Quarkus
  4. Implementação do endpoint SSE
  5. Autenticação JWT no SSE
  6. Implementação do cliente Angular
  7. Debug ao vivo: problemas de CORS e autenticação
  8. Discussão sobre Clean Code e contexto
  9. Testes e manutenção de código SSE
  10. Conclusão e próximos passos

Próximo vídeo sugerido

Avaliações

Avaliação dos alunos 0.0
0 avaliações
Avalie esta aula

Ajude outros alunos a entenderem se esta aula foi útil.

Ainda não há avaliações. Seja o primeiro a avaliar esta aula.