728x90
반응형
Next.js 14) 서버 컴포넌트에서 데이터 패칭
Next.js2024. 2. 24. 11:05Next.js 14) 서버 컴포넌트에서 데이터 패칭

그러니까 아까의 경우에는 최상위 부모 컴포넌트가 서버 컴포넌트이고 여기서 데이터 패칭을 한 후 그걸 자식 컴포넌트로 보내고 있으니 프리랜더링이 되는 셈이다. 단지 받아온 데이터가 보이지 않았던 이유는 recoil 값을 사용하여 datas 배열을 잘라 새 배열로 만든 후, 그 값을 가져다 사용했기 때문이다. recoil은 클라이언트 컴포넌트에서만 사용할 수 있고, 그 결과 자바스크립트를 꺼둔 상태에서는 클라이언트 요소는 가져올 수 없으므로 받아온 데이터가 보이지 않았던 것. recoil 값이 없을시(렌더링이 완전히 끝나기 전에는 recoil 값을 받아올 수 없으니) default 값을 처리해주면 다시 받아온 데이터가 화면에 뜨는 것을 볼 수 있다. 자바스크립트 기능을 끄고 데이터가 한참 동안이나 화면에 보..

728x90
반응형
image