React에서 URL 기반 페이지네이션 구현 (feat. useSearchParams)

페이지네이션은 대부분의 리스트 페이지에서는 필수적인 기능입니다.리스트로 보여줄 데이터 10개 미만이라면 그냥 모든 데이터를 보여줘도 상관없겠지만, 그게 1억개가 된다면 UI적으로는 물론이고 백엔드 서버에도 큰 부하를 줄 것입니다.그래서 거의 모든 서비스에서도 리스트 페이지를 구현할때, 페이지네이션을 이용할 것입니다.React 페이지네이션, 왜 URL과 함께 관리해야할까?저는 vapevibe의 상품 목록에서 원래 useState를 이용하여 페이지네이션을 관리하려고 했습니다. 그 이유로는 번잡한 URL를 사용자에게 보여주고 싶지 않았기때문이죠.근데 몇가지 문제가 있었습니다.사용자가 '뒤로 가기'를 눌렀을 때, 항상 첫 페이지로 돌아감URL을 복사해도 현재 페이지 정보가 유지되지 않음새로고침하면 페이지 상태가..

2025.06.09