하이드레이션 에러(Hydration Error)
·
Develop/Frontend
하이드레이션 에러는 오직 "클라이언트 컴포넌트" 에서만 일어납니다.리액트의 하이드레이션 에러를 이해하기 위해, 서버 컴포넌트와 클라이언트 컴포넌트 그리고 하이드레이션 기법에 대한 이해가 필요해요.하이드레이션 기법"물을 주다" - "촉촉하게 하다" 라는 의미로, 메마른 클라이언트 컴포넌트에 이벤트 등 JS 로직을 불어 넣어주는 과정이에요.즉, 서버에서 만들어진 HTML에 클라이언트의 JS 로직을 붙이는 과정입니다. (이벤트 핸들러/ 혹은 리액트의 상태 등) 참고로 서버 환경에서는 브라우저가 존재하지 않으니, 브라우저에서만 실행될 수 있는 코드들은 사용할 수 없습니다.이벤트핸들러, webAPI나, useState, useEffect 등의 코드들은 서버 컴포넌트에서는 사용할 수 없습니다. 서버 컴포넌트서버에서..