ssr

[Next.js] "window is not defined" 에러 해결

🚑 문제 상황 pages 내에서 로그인 유저 정보를 로컬 스토리지로부터 받아와야하는 상황이 있었는데 해당 에러를 마주하게 되었다. 서버사이드 렌더링(SSR)에 대한 이해가 부족했기 때문에 발생한 문제였다. SSR은 서버에서 사용자에게 보여줄 페이지를 모두 구성해서 사용자에게 페이지를 보여주는 방식으로, 서버에서 웹 페이지를 렌더링할 때 window나 document 같은 객체가 존재하지 않기 때문에 발생하는 에러이다. 🔧 해결 방법 1. typeof 사용 해결 방법은 여러 가지가 있지만 typeof를 사용해서 간단하게 해결할 수 있었다. // 사용 예 1. const [loginUser, setLoginUser] = useState( typeof window !== 'undefined' ? JSON.pa..