YoungBLUE

에러 발생 업무중 에러가 발생했다. Uncaught (in promise) TypeError: props.closeModal is not a function. 정말 바보같은 상황이었다. 알고보면 아무것도 아니고 간단한 해결이지만, 처음 시작하는 초심자의 마음일떈 내가 뭐 잘못한지 모르고 왜 오류나는지 찾기 때문에 이런 것도 블로그에 적어본다. 상황 설명 나의 경우 내부 컴포넌트의 모달을 부모의 구현부에서 속성으로 show: true/false 를 하는데 이때 '닫기' 또는 완료 했을 경우 props 로 제공한 closeModal 이라는 함수를 호출한다. (any) 그런데 제대로 제공을 하고 호출을 했음에도 불구하고 is not a function 이라는 오류가 나는게 아닌가? 해결 방법 알고보니 저 모달..

에러 발생 업무 중에 다음과 같은 오류가 발생했다. Uncaught Error: useNavigate() may be used only in the context of a component. 내용을 보아하니 라우터를 통해있는 컴포넌트 내부에서 useNavigate를 사용해야 한다고 나온다. 어떤 상황이었냐면, 개발 중인 화면 내부에서 라우터를 통해 움직이는 컴포넌트가 아닌 외부 컴포넌트에서 useNavigate()를 선언했던 것이다. 이 경우 useNavigate()를 선언 하기만 해도 바로 오류가 뱉어지니 나처럼 영문도 모른채 페이지 로드가 안된다면 개발자 도구 - 콘솔 창을 열어서 한번 확인 해보자. 해결 방법 다양한 해결법이 있다. window.location.replace('url') 을 사용한다..

JavaScript 로 코드를 작성하다보면 혹은 팀끼리 개발할 때 코드 컨벤션에 맞춰야할 때가 있다. 물론 WebStorm 에도 맥OS 기준으로 option + alt + L 을 누르면 코드 정렬이 되긴 하지만 따로 설정도 해야하고 하나의 컴포넌트에 여러개 옵션들을 넣을 때 자동으로 줄바꿈이 되지 않아서 옆으로 길어지는 경우가 있다. 이때 사용 할 수 있는 것이 prettier 다. Prettier 설치하기 Preferences - Plugins - Marketplace - Prettier - install 내가 하고있는 프로젝트에서 상단의 Preferences 로 진입해주자 이후 좌측 사이드 메뉴에서 Plugins - Marketplace 에서 Prettier를 검색 후 설치. 그 다음 터미널에서 프로..