인프런 커뮤니티 질문&답변
작성한 질문수
상태관리
해결된 질문
작성
·
71
0
next는 자동적으로 캐시 저장기능이 있고 next에서도 DB 데이터가 필요한 페이지에서 직접 불러와서 사용하는 것을 권장한다 라고 말씀해주셨는데요
그러면 next는 보통 zustand, recoli, redux와 같은 상태관리 라이브러리를 사용하지 않는 것을 추천하시나요?
아니면 사용하는 것을 추천하시나요??
답변 2
0
안녕하세요 이정환입니다.
서버컴포넌트와 연관된 앱 라우터 버전 Next.js의 데이터페칭 기능은 서버사이드 측의 동작에 집중되어 있습니다. 애초에 데이터 페칭 작업 자체가 서버사이드에서 이루어지며 데이터 캐싱 및 리퀘스트 메모이제이션 모두 서버 측에 데이터를 캐싱하는 기능이기 때문입니다.
따라서 만약 질문자님께서 클라이언트 사이드 측의 데이터 관리가 필요한 상황이라고 하시면 서버 사이드 위주의 기능을 제공하는 Next.js의 기능 만으로는 기능 구현이 어려울 수 있습니다. 예를 들어 무한 스크롤을 구현하는 상황을 가정해보죠! 무한 스크롤은 사용자가 현재 브라우저에서 보고 있는 뷰 포트를 읽어서 새로운 데이터를 불러오고, 그렇게 불러온 데이터를 기존 데이터와 합치는 등의 상태 관리가 필요한데 이는 서버 사이드에서는 해결하기 어려운 문제입니다.
따라서 결론적으로 이처럼 클라이언트 사이드에서의 사용자의 특정 동작으로 인한 데이터 관리가 필요하다면 Zustand, Recoil, Redix 등의 기능을 활용하시면 좋을 것 같습니다 😀
0
안녕하세요, 인프런 AI 인턴입니다. Full Stack 개발자님.
Next.js에서는 서버 측 렌더링(SSR)과 정적 사이트 생성(SSG)의 기능을 통해 초기 페이지 로드 시 필요한 데이터를 서버에서 미리 가져올 수 있습니다. 이를 통해 클라이언트 측에서의 데이터 요청을 줄일 수 있으며, 이러한 특성 때문에 클라이언트 측 상태 관리 도구가 필요 없을 수도 있다고 느끼실 수 있습니다. 하지만 특정 상황에서는 상태 관리 도구가 여전히 유용할 수 있습니다.
상태 관리 도구의 필요성
Zustand, Recoil, Redux와 같은 라이브러리: 이들은 클라이언트 측의 사용자 인터페이스에서 발생하는 이벤트를 관리하거나, 다양한 컴포넌트 간의 상태를 공유할 필요가 있을 때 유용하게 사용됩니다. 특히 큰 규모의 애플리케이션이나 복잡한 상태 구조를 관리할 때 효과적입니다.
CSR(Client-Side Rendering) 필요 시: Next.js에서는 페이지 렌더링 방식을 SSR, SSG뿐만 아니라 CSR도 지원하고 있습니다. MVVM 구조의 클라이언트 측 상호작용을 위해 상태 관리가 필요하다면 Zustand 등과 같은 상태 관리 도구를 선택할 수 있습니다.
결론적으로, Next.js 내에서 CSR을 기반으로 하는 많은 상호작용이 필요한 페이지나, 클라이언트 상태 관리가 복잡한 프로젝트의 경우 Zustand, Redux, Recoil과 같은 상태 관리 도구를 사용하는 것이 도움이 될 수 있습니다. 프로젝트의 요구사항과 복잡성에 따라 적절히 선택하시기 바랍니다.
관련하여 유사한 기존 질문 및 답변을 통해 보다 구체적인 정보를 얻으실 수 있습니다:
이 두 게시물에서는 다양한 상태 관리 도구의 특징과 어떠한 상황에서 사용하는 것이 좋은지를 설명하고 있습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.