본문 바로가기

nextJS2

Next.js 헷갈리는 개념 정리 1. prefetch할때 왜 void를 사용할까?- 명시적으로 이건 의도적으로 기다리지않음을 나타 내기 위함- 클라이언트 컴포넌트가 이미 prefetch가 되어있다 라는 사실을 인식하도록 만들기 위함- 즉, 서버에서 prefetchQuery()를 통해 쿼리 키를 미리 등록하면 클라이언트는 추가 fetch없이 hydration된 상태를 그대로 쓴다.- 한마디로 “이 쿼리는 이미 실행했고, 클라이언트에서도 그걸 알게 해줄 상태 준비가 끝났어” 2. ServerSide란? 클라이언트가 아니라 서버에서 실행되는 모든 로직과 처리 과정을 의미한다. 즉, 서버에서 코드가 동작하며 html, 데이터 혹은 전체 페이지를 만들어 보내는 역할을 한다.대표적인 역할 및 사용 이유는1. 데이터 fetch - db연결, 비공.. 2025. 7. 21.
Next.js 발전에 의한 상태 관리의 변화 React 및 Next.js 개발을 진행하다 보면 상태 관리에 대한 "이 상태는 어디서 관리해야 하지? 서버인가? 클라이언트인가?"라는 생각을 빼놓을 수 없다. 클라이언트에서만 사용하는 UI 상태인지 아니면 서버에서 받아온 데이터를 다뤄야 하는지에 따라 접근 방식이 완전히 달라진다. 그럼 어떻게 접근 방식이 달라져왔을까? 예전 방식은 fetch와 useState를 사용하여 서버에서 데이터를 가져오고 상태를 관리했다.useEffect(() => { fetch('/api/data') .then(res => res.json()) .then(data => setData(data));}, []);방식은 간단하지만 단점이 많은 방식이다.대표적인 단점으론1. 데이터를 요청할 때마다 중복 로직이 발생함2... 2025. 7. 20.