인프런 커뮤니티 질문&답변

신동마님의 프로필 이미지

작성한 질문수

Next + React Query로 SNS 서비스 만들기

미흡한 부분 구현하기

검색 필터 기능 구현 방식 질문

해결된 질문

24.04.03 15:47 작성

·

275

0

  1. 현재 X 프로젝트에서는 게시글 검색 및 필터 기능을 다른 페이지로 가게끔 설계가 되있는데요! 이와 같은 방식은 검색 데이터와 필터 데이터를 브라우저 주소에 관리하는 방식이라고 생각합니다. (맞게 생각하고 있는건지?)

     

  2. 현재 제가 팀 프로젝트로 여러개의 탭 중 커뮤니티 탭을 구현하고 있는데 커뮤니티 탭안에서만 검색 및 필터 기능을 구현하고 있습니다. 여기서 궁금증이 커뮤니티 굳이 브라우저 주소를 변경하지 않고 클라이언트 상태관리로 검색값 필터 값을 관리해도 되는걸까요?

정리해보자면

  1. 브라우저 주소로 검색 값 및 필터 값 관리

  2. 클라이언트 데이터로 검색 값 및 필터 값 관리

둘 중 어떤 게 더 좋은 방식인지 궁금합니다.

제가 생각했을때는 검색 및 필터 기능 사용 시 다른 페이지로 이동시키는건 전체 페이지가 리페인트되기 때문에 클라이언트 상태 관리보다 좋지 않은 방식인거 같은데 이점이 있는걸까요?

답변 1

1

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

2024. 04. 03. 15:49

  1. 네 맞습니다. 새로고침에 대응하려고 하는 겁니다.

  2. 그래도 상관은 없습니다. 다만 새로고침 시 검색/필터가 적용되지 않은 페이지로 가겠죠.

새로고침 여부가 제일 중요합니다. 클라이언트 데이터도 로컬스토리지같은데 저장할 수는 있으니 문제는 없습니다.

다른 페이지로 이동시킨다해서 전체 페이지가 리페인트되지 않습니다. 레이아웃은 공유됩니다.

신동마님의 프로필 이미지
신동마
질문자

2024. 04. 03. 15:57

아 그렇군요.. 레이아웃은 공유되니까 게시글 목록만 리페인트 되겠네요! 답변 감사합니다.

저도 브라우저 주소 변경 방식을 따라가봐야겠네요!