준영의 지식 블로그 준영의 지식 블로그

Next.js 기반 프로젝트에서 외부 라이브러리를 설치한 컴포넌트를 로드하는데, 아래와 같은 에러가 떴다. 알아보니, 서버에서는 앞의 id 를 사용했지만, 클라이언트에 그려질 때는 뒤의 id 를 사용했다는 것 같았다. 그래서 크롬 개발자 도구에서 id 를 확인해봤다. 브라우저는 클라이언트로 알고 있었는데, 서버측의 id 를 보여주고 있는게 조금 이상했다. 이 부분은 나중에 좀 더 공부해보자. 아무튼, Next.js 의 렌더링 방식이 클라이언트 사이드 렌더링과 서버 사이드 렌더링으로 나뉘어있어서 생기는 문제라고 가설을 세웠다. 가설을 검증하기 전에, 우선 같은 에러를 마주한 사람이 있을 것 같아서 에러를 그대로 구글에 검색해봤다. 검색 결과, 내가 세운 가설과 비슷한 답변을 한 사람이 있었다. 요약하면, ..