Modal

React Following Follower Modal창 동기화하기

블로그 이전하였습니다. React Following Follower Modal창 동기화 react-query의 queryClient를 이용해서 팔로우 팔로워 모달창을 동기화 시켜보자 yoon-hae-min.github.io 기존 글 진행 동기 Breaking프로젝트를 진행하면서 프로필 팔로잉 팔로워 모달창에서 유저를 팔로잉 할시에 반대편 모달창에 그 값이 적용되지 않았고 이를 해결하기 위해서 Profile Modal에 state로 만들어 두 개의 Modal을 묶어서 처리했는데 이보다 좋은 방법이 없을까 고민하던 중 optimistic update를 배우면서 이와 비슷하게 직접 queryCache에 접근해서 해결해 보자고 생각하였다. 리펙토링 시리즈 인피니티 스크롤에서 데이터가 많아지면 프레임이 떨어짐 마..

props로 modal관리는 이제 그만

페이지로 만들기는 싫고 간단한 창을 띄워 한 페이지 내에서 유저의 접근을 받고 싶을 때 modal을 애용해 왔다 새 페이지를 왔다 갔다 하는 것보다 좀 더 한 템포 빠르게 유저와의 상호작용이 일어나 좋아했다. Modal 동작원리 modal을 동작하게 하는 방법에는 크게 2가지가 있다 modal open close시에 dom에 직접 component를 넣다 빼는 방법 css의 visible을 이용해서 modal이 안보이는 것처럼 보이게 하는 방법 1번의 방법은 open close마다 component를 랜더링 한다는 의미는 modal전체를 다시 그려야 한다는 것이므로 modal이 커질수록 open close시에 반응이 늦어진다는 이야기이다. 그래서 대부분의 modal창에서는 2번 방법을 사용한다. Moda..