Today I Learned
날짜
2024년 12월 11일 수요일
내용
리마인더 알람기능
이것저것 아주 간단한 기능들을 고치거나 만드는 중. 기본 코드가 워낙 보기 쉽게 잘 짜여져있고 로직도 단순해서 큰 어려움은 전혀 없었다. 다만, 리마인더 기능은 조금 고민이 들었다. 티켓에는 리마인더 기능이 있는데, 노션에서 처럼 일정 기간 후 유저에게 알려줘야 한다. 물론 유저가 티켓 페이지에 접속했을 떄만.. 그래서 유저가 티켓 페이지에 들어왔을 때 리마인더를 조회하도록 했다. 설정된 리마인더 시간이 가장 빠른 것부터 보여준다(다시 말하면 알람이 울린지 가장 오래되었다는 뜻).
로직 자체는 쉽고 단순했으나 코드를 어디에 어떻게 짜야 할지 생각을 많이했다.
- 티켓페이지 자체가 한 페이지임에도 여러 하위 컴포넌트들을 가지고 있었다. 이 기능은 따로 서비스로 만들어 주입시켰다.
- 현재는 티켓에서만 사용되지만, 리마인더 자체가 나중에는 전역적으로 사용될 수도 있지 않을까(뇌피셜)? 따라서 리마인더 서비스를 만들고 그 내에 티켓 리마인더를 따로 만들었다.
특히 어려웠던 부분은 컴포넌트가 초기화 되는 과정에서 유저를 알아야 한다는 점이다. 내가 파악한 바로는 현재 로그인한 사용자가 누구인지 세션에 저장되어 있지 않았다. 따라서 컴포넌트가 최초 초기화되는 ngOnInit() 에서 문제가 발생했다. 현재 유저를 아는 방법은 서버에 account/me/ 를 보내는 방식이라, 응답을 받는데까지 시간이 필요하다. 따라서 초기화 시점에 “나의 리마인더가 있는지 확인”하는 시점에 “나”에 대한 데이터가 아직 들어오지 않은채 진행되어 없다고 뜨는 경우가 많았다. 조금 시간차를 두면 될까 싶어 리마인더 조회를 AfterViewInit 에서 해보았지만 역시 안됬다.
user 상태를 구독으로 처리해서, 유저가 확인이 된 후에 필요한 로직들이 진행되도록 수정했다. 내가 만든 결과물이 직접 보이니 이보다 신날 수가 없다! 맨날 쿼리만 짜다가!
회고
구독이 상태를 확인하고 그 이후 로직을 진행한다고 얼핏 생각만 하고 있을뿐 RxJS의 Observable 이 **뭔지, 애초에 RxJS는 뭔지를 모르니 지피티가 써준 코드가 이해가 안되니 빨리 공부해야겠다.
