[TIL] 2022/01/01 Sat

 

 

 

 

Today I Learned

 

 

 사이드바 프로필 정보 상태관리 

 

원래 사이드바에서 보이는 프로필 이미지와 닉네임 정보는 마이페이지 api가 아닌

딱 프로필 정보만 리스폰스로 받아오는 또다른 api를 사용하고 있었다.

마이페이지 api로 받아오는 데이터는 프로필 정보 외에도 유저가 작성한 글 등 양이 꽤 많았기 때문이다.

 

마이페이지에는 프로필 이미지와 닉네임 변경 기능이 포함되어 있는데,

프로필 정보 변경 기능도 마이페이지 모듈 안의 리덕스와 연동하여 관리하고 있어 

프로필 이미지와 닉네임을 변경하면 마이페이지에서 보여지는 프로필 이미지와 닉네임은 바로 변경사항이 적용되었지만,

사이드바에서의 프로필 정보는 의도적으로 리로드를 해줘야 변경되는 문제가 있었다.

 

1) 사이드바는 그대로 프로필 정보만 받는 별도의 api를 사용하면서 프로필 정보 변경 시 강제로 리로드 시켜주기

2) 마이페이지 스토어에 저장되어 있는 프로필 정보를 전역으로 사용하기

 

둘 중에 선택하면 됐는데, 나는 2번으로 다시 수정하기로 했다.

 

이유는,

1) 사이드바는 헤더와 연결되어 있는데, 헤더가 고정형이라서 강제로 리로드를 시킬 경우 사이드바뿐만 아니라

유저가 현재 있는 페이지와 관련된 api까지 호출되어 불필요한 비용이 발생할 수 있고,

2) 마이페이지 api의 리스폰스로 받아 오는 데이터가 많기는 하지만 사실상 마이페이지에서 게시글을 새로 작성하는 건 불가능하기 때문에,

    오히려 리덕스로 관리해서 사이드바에서도 불러와서 사용하면 api 호출 횟수를 줄일 수 있을 거라는 생각에서였다.

 

사이드바 프로필 정보를 리덕스 스토어에서 불러 와서 출력하는 쪽으로 수정한 지금은

닉네임과 프로필 이미지를 변경해도 불필요한 리렌더링 없이 수정사항이 잘 반영된다!

 

 

그 외에도 짤방 이미지 추가하기, 삭제하기, 삭제 토글메뉴 조건부 렌더링 등을 구현했는데

짤방 이미지 추가하기는 기존에 하던 방식이랑 조금 차이가 있어서 예상보다 시간이 좀 걸렸고,

나머지는 늘상 하던 거라 큰 어려움 없이 끝낼 수 있었다.

 

 

다음주는 짤방 페이지 관련하여 좋아요 기능과 무한 스크롤을 마무리하고, 디자인 시안대로 페이지 뷰를 수정한 후 배포해야 한다.