# window is not defined 발생 오류

## 문제

다크모드를 구현하는 중 localStorage를 사용해야 하는 부분에서 'window is not defined'라는 오류가 발생했다.&#x20;

![](https://392860516-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MfeU6iu5edmjAHSpL85%2F-Mfr_xTPc9BmS8IVnzT4%2F-Mfralq-IazLc8U5G-iL%2Fimage.png?alt=media\&token=5a0bcd46-ce79-4759-aa3d-a924ee8a92e6)

## 원인

Next.js는 server-side에서 먼저 실행이 되고, 그 후에 client-side에서 실행이 된다.

window는 client-side에만 존재하기 때문에 발생하는 오류다.

## 해결

이를 해결하기 위해서는 componentDidMount 코드 내에 작성해야 한다고 한다.

{% embed url="<https://stackoverflow.com/questions/55151041/window-is-not-defined-in-next-js-react-app>" %}

그래서 나는 함수형 컴포넌트이기 때문에 useEffect 내에 localStorage 관련 코드를 작성해 주었다.

![](https://392860516-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MfeU6iu5edmjAHSpL85%2F-Mfr_xTPc9BmS8IVnzT4%2F-Mfrcw2J6idJjLl9ABj5%2Fimage.png?alt=media\&token=5eeaeda9-e377-4804-923f-c8d7f491a26a)
