유튜브블로그Top 10
내 프로필

데브허브 안내
소개업데이트 소식

데브허브 커뮤니티

I added server-sent events to my app (but I think it was a mistake)

Web Dev Cody

2025. 7. 31.

0

#frontend
#backend
  • 서버에서 보낸 이벤트(SSE)를 앱에 추가하여 실시간으로 사용자 인터페이스를 업데이트하는 기능 구현 📡
  • 사용자가 아이디어를 제출하면 서버는 OpenAI를 통해 태그를 생성하고, SSE를 통해 사용자에게 결과를 알림 💡
  • SSE 연결은 클라이언트와 서버 간의 지속적인 연결을 유지하며, 이벤트 발생 시 즉시 업데이트를 전송 🔄
  • 낙관적 업데이트를 사용하여 사용자 경험을 개선하고, 백그라운드에서 태그를 생성하여 UI 응답성을 유지 🚀
  • 서버는 이벤트 이미터를 사용하여 태그 생성 이벤트를 감지하고, 해당 사용자에게만 업데이트를 전송 🎯
  • 단일 서버 환경에서는 잘 작동하지만, 로드 밸런서 뒤에 여러 서버가 있는 경우 메시지 브로커가 필요 🌐
  • SSE 대신 폴링 방식을 사용하여 서버의 상태를 유지하지 않고도 유사한 기능을 구현할 수 있음 🔄
  • 폴링은 사용자 경험에 약간의 지연을 발생시킬 수 있지만, 전체적인 복잡성을 줄일 수 있음 🤔
  • Convex와 같은 서비스를 사용하면 데이터 변경 시 모든 사용자에게 자동으로 알림을 보낼 수 있어 편리함 🔔
  • SSE 구현은 복잡하며, 상태 저장 서버를 유지해야 하므로 폴링이 더 나은 선택일 수 있음 🤷‍♀️
  • 서버 이벤트 엔드포인트는 사용자의 요청을 수락하고, 읽기 가능한 스트림을 생성하여 연결을 유지 🔗
  • 백엔드 API의 모든 코드에서 공유되는 이벤트 이미터를 통해 태그 생성 이벤트가 발생하면 메시지를 사용자에게 전달 📢
  • 사용자 ID가 일치하는 경우에만 메시지를 전달하여 특정 사용자에게만 업데이트를 전송 👤
  • 실제 배포된 앱에서도 여전히 문제가 발생할 수 있으며, 완벽하게 작동하지 않을 수 있음 🚧

Recommanded Videos