8월 26일 (월) 회고 - dev-FEFIVE/NadoCat GitHub Wiki

각자 자유로운 형식으로 작성해주세요.

문소영

chat 기능을 테스트하며 엄청난 결함을 발견했다. 채팅하기를 눌렀을때(string), 채팅목록에서 눌렀을때(buffer) 두 가지 경우로 채팅을 할 수 있는데 이때 형식이 달라서인지 인식을 못해서 이미 있는 채팅인데도 새로운 채팅이 만들어진다는 것이었다. 그래서 두 가지의 경우를 나누고 접근방식을 달리해 데이터를 보냈다. 새롭게 해보고 많은 디버깅을 할 수 있는 경험이었다.

박민혜

왜 제일 처음 회원가입을 하고 첫 로그인을 하면 분명 uuid를 localStorage에 저장하는데 회원전용 페이지에 접근하려고 하면 uuid를 인식하지 못하고 로그인창으로 이동하는가?
찾아보니 이건 리액트의 생명주기와 관련이 있었다.
login 페이지에서 zustand에 저장하러 갈 때 await를 붙여주니 해결되었다. 처음에 await를 붙여주지 않아, localStorage에 저장하기 전 먼저 렌더링 해버리고 홈으로 가버렸던 게 문제였다.(이후에 uuid를 저장하니 당연히 못 받아옴...)
로그아웃 기능을 구현하는데, 로그인을 하면 스토리지에서 uuid를 삭제해줘야 한다.
구현하다보니 보안 문제가 걱정되었다. 보안을 위해 jwt토큰을 http-Only 쿠키에 저장하고 있는데 uuid를 굳이 localStorage에 저장할 필요가 있을까?

박소현

css 충돌로 인해 실종고양이 게시판이 의도대로 렌더링 되지 않는 문제를 너무 오래 잡고 있었다. 결국 팀원이 많이 도와줬다. padding 설정을 최상위 루트에서 설정했을 때, 그 영역을 벗어난 내용이 필요할 때 (디바이더 등) 큰 불편감을 느꼈다. 컴포넌트 별로 따로 설정해주는 것이 좀 더 자유로운 스타일링이 가능한 것 같다.
팀원이 많이 도와준 덕분에 opensearch 작업에 들어갈 수 있었다. opensearch API를 작업하는 중이다.

이화정

각종 오류와 버그를 찾는 일을 했다. 다 고려해서 구현했다고 생각했지만 생각보다 사소한 곳부터 기능상 문제가 생기면 안 되는 부분까지 다양한 오류들이 있었다.
내가 구현한 게시판들은 정렬 기능이 있는데 원래는 사용자가 선택한 정렬 기준을 useState에 저장했더니 브라우저를 새로고침하거나 페이지를 이동한 후 돌아오면 이전 정렬 기준이 초기화되어 사용자 경험이 저하되는 문제발생 했다. 이유는 useState의 상태는 컴포넌트의 생명주기 안에서만 유지되며, 브라우저를 새로고침하거나 페이지를 이동할 때 컴포넌트가 언마운트되면 이 상태는 사라져버리기 때문이다. 이런 정렬 기준을 저장하는 다양한 방법들이 존재했는데 제일 간단한 localStorage 방식을 사용했다. 이 방법은 치지직이 라이브 방송 정렬 기준을 저장하는 용도로 사용하고 있었다.

장세림

TanStack Query를 사용하면서 상태 관리의 편리함을 체감한 부분이 있었다. 게시글 생성/삭제/수정 과정 후 목록으로 돌려보내면, 화면상에 아직 업데이트 되기 전 모습이 보였고 페이지를 새로고침해야 화면에 반영이 되었다. 하지만 queryClient.invalidateQueries()는 사용자가 변경한 데이터를 즉각적으로 반영할 수 있도록 해주었다. 특정 쿼리 키에 해당하는 데이터를 무효화하고 다음 번에 해당 데이터를 다시 패칭하도록 만들어 불필요한 새로고침 없이 최신 데이터를 UI에 바로 보여줄 수 있었다. 복잡한 로직 없이도 손쉽게 UI에 변화를 반영할 수 있는 TanStack Query가 데이터 중심 애플리케이션에 유용하다고 느꼈다.
동네 고양이 지도에 커스텀 레이어를 올려 마커를 여러개 올렸다. 그리고 마커를 클릭했을 때 해당 고양이에 대한 정보값을 띄우는 모달을 추가했다. Prisma는 꽤 익숙해졌다고 생각했는데, 이 부분 쿼리문이 복잡해서 꽤 헤맸다... 너무 쉽게 익숙해졌다고 느낀 것 같아 괜히 민망하다.
scss를 잘못 사용했던 것 같아 멘토님께 여쭤보았다. 이전에도 느꼈지만 결론은 모듈화, 관심사 분리를 제대로 하지 못한 점이 문제였다. 우리가 추측했던 문제점과 일치해서 좋으면서도 계속해서 아쉬움이 남았다.