[스프린트 더줄게 프로젝트] 팀원의 트러블 슈팅 직관후기

팀원 분의 헤더 컴포넌트 구현

한 팀원 분께서 위 컴포넌트를 구현하는 것을 맡으셨다. 간단해보이지만 사실 간단하지 않다. 로그인 로그아웃 유무도 그렇고 search 하는 부분도 그렇고 무엇보다 저 notification.

 

헤더 맨 오른쪽 자그마한 아이콘을 누르면 뜨는 컴포넌트이다. 팀원분이 여기서 어려운 부분이 있으셨는데 아래와 같다.

 

 

타입 쪽은 내가 자료를 찾아서 궁금증을 해소시켜드렸고 첫 메시지를 보면 모든 알림을 읽음 처리했을때 자동으로 알림창이 닫히는 문제가 있으셨다고 했다.

 

뜨거운 토론 현장

이에 대해서 이 팀원 분과 많은 얘기를 나눴다.

 

나도 코드를 보며 문제점을 찾기 정말 어려웠지만 결국엔 찾아내었는데 처음에는 race condition 이슈인가(?) 하다가 자바스크립트 동작 원리 때문임을 파악을 했다. (딥다이브를 읽는 등, 자바스크립트 동작원리 자체를 잘 공부한 적은 없는데 파악해낸게 용하네 ㅎ) 결과적으로 setTimeout과 같은 web api로 문제가 있는 코드를 한 번 감싸주면 된다.

 

 

이 분이 코딩을 잘하시긴해서 다른 해결법도 알아오셨다. 사실 조건문만 바꿔주면 해결되는 문제긴 했다. 근데 로직 자체를 좀 이해가 안되게 짜신 부분이 있어서 그 부분은 의아하기도 했지만 추후 소통을 계속하며 리팩토링을 하면 되는 부분이다.

 

 

(매우 뿌듯!)

또 한 번의 성장

요새 여러 이유로 자신감을 많이 잃었었는데 이 분이랑 같이 코딩을 하면서 너무 재밌었고 내가 생각보다 잘하는 구나(?)란 걸 깨달았다. 이 분과 테이블 컴포넌트 공통화도 같이 작업을 하는 등 정말 서로 많은 도움이 되었다.(다음에 포스팅할 예정)