에러5 [error] Hydration failed because the initial UI does not match what was rendered on the server Next.js 13.2.4 버전에서 개발 중, yarn dev 로 실행하여 캐러셀 컴포넌트를 클릭 시 발생한 에러 에러 원인 배포 전, yarn dev 로 next.js 웹 어플리케이션을 실행 후, 링크에 연결 후 빠르게 캐러셀에 클릭 등 유저 이벤트 발생 시 해당 에러 발생 해결 방법 해당 에러는 개발 중인 페이지를 yarn dev 로 실행 시, 빌드 하지 않고 ssr 이나 csr로 랜더링 되는 next.js 의 특성 상 발생하는 에러이다. yarn dev로 실행 시, 빌드되지 않은채로 ssr이나 csr 로 랜더링 된다. 이때 pre-rendering 된 요소에 hydration 이 완료되기 전에 접근하게 되면 해당 에러가 발생한다. 빌드 후 배포 시에는 pre-rendering과 hydration 사.. 2023. 2. 28. [error] ~ is missing in props validation react 에서 하위 컴포넌트에 props 를 이용해서 데이터를 전달하려던 중, 그-컴포넌트 is missing in props validation 해당 컴포넌트 파일에서 해당 props 를 사용하는 부분에서 모두 위와 같은 에러가 떴었다 에러 원인 props 의 타입 검증이 필요하다는 의미이다 eslint 를 사용할 때에 나오며, 오류를 막기 위해 props의 더 정확한 타입을 요구하는 것이다 해결방법 yarn add prop-types 로 라이브러리를 설치 후, props 를 받는 해당 컴포넌트 정의 파일 내에서, import PropTypes from 'prop-types' 임포트 해 온 후, 해당 컴포넌트와 같은 최상위 레벨에서(=컴포넌트 밖에서) 아래와 같이 props 타입을 정의해주면 된다 대.. 2022. 11. 30. 생활코딩 node.js 10강 에러 원인, 대처법 생활코딩으로 node.js 강의를 따라 들으며 배우던 중 10강에서 에러가 뜨고 이해가 안되는 부분이 있어서 학습에 진행이 생겼다 혹시나 나와 같은 경우를 겪는 분들이 있을까해서 10강의 내용을 개인적으로 보충하려 한다 https://opentutorials.org/course/3332/21046 Node.js - URL로 입력된 값 사용하기 - 생활코딩 수업소개 URL에 포함된 쿼리 스트링을 해석해서 이용하는 방법을 살펴봅니다. URL의 이해 강의 Node.js에서 URL을 통해서 입력된 값을 사용하는 방법 강의 실습하실 때 url 뒤에 ?id= 의 값을 직접 입 opentutorials.org 위 강의 내용를 보면 이전까지는 http://localhost:3000/1.html 처럼 url 의 / 뒤에.. 2022. 8. 11. 소스트리 클론 생성 시 경로가 빈 폴더가 맞는지 확인하자 이미 git 파일이 있는 폴더라면 fatal: destination path already exists and is not an empty directory 등의 에러가 뜨며 생성이 안된다 그러니 저 에러가 뜨면 내 경로의 폴더가 비었는지 확인하자 2022. 6. 28. 이전 1 2 다음
