분류 전체보기

넷플릭스 앱 클론코딩을 하면서 넷플릭스 앱에 들어갈 컨텐츠 업로드와 삭제 등을 하기 위해서 파이어베이스를 연결시켰다. 그런데 아무리 import을 해도 연결이 안되는 것이다 ㅠㅠㅠ 아무리 구글링을 해도 다들 npm install firebase만 얘기하고 심지어 해봤지만 소용없었다. 거의 1-2시간동안 미친듯이 구글링을 해서 찾아냈다!!! 해결방안!! With version 9 things changed a bit for importing firebase, but there is no need to downgrade to a previous version, there is a “compatibility” option so can use the /compat folder in your imports, li..

onclick 함수를 써서 props를 넘겨주려고 하는데 갑자기 이런 에러가 났다. 문제의 발생지점이였던 부분을 캡처를 못했다. ㅠㅠ 리렌더링이 많이 일어났다고 경고메세지가 뜬것인데, 구글링을 해서 알아보니 이 에러가 발생하는 원인은 렌더 과정에서 state를 변화하는 함수가 있다면 리랜더링이 계속 일어나면서 발생하는 에러라고 한다. 해결방법은 생각보다 간단했다. 화살표 함수를 만들어서 넘겨주면 된다! 그냥 바로 함수만 적지 말고 화살표함수로 적어서 넘기면 된다!

❌ Error: input is a void element tag and must neither have children nor use dangerouslySetInnerHTML. react 프로젝트를 만드는 과정 중에 처음으로 component 단위가 아니라 element 단위까지 쪼개서 만들어보고 있다. 로그인 폼에 들어갈 input 부분을 만드는 과정에서 만든 에러! styled component를 작성하는 과정에서 input은 그대로 적용할 수 없고, div로 한번 감싸줘야한다. 그래서 InputForm을 만들어 두고 밑에 적용할 때는 div가 아니라 input으로 적용했더니 저런 에러를 맞이했다. div로 수정해주고 오류 고침! 뭐랄까 재사용이 용이하게 컴포넌트를 나누고 엘리먼트를 나누는건데, ..

React-router가 v6로 업데이트되면서 react-router-redux에서 쓸 수 있는 connected-react-router를 쓰려면 v4,v5를 설치했어야했다. 하지만 당연히 최신버젼도 지원이 될 거라고 생각하고 방법이 있을 거라고 생각하며 대략 한 시간 이상을 구글링으로 방법을 찾았다. ㅎㅎㅎ 그러면서 만난 오류. 터미널에는 오류가 뜨지 않지만 브라우저 화면에는 붉은 색화면이 …. ㅎ Connected React Router란? 리덕스에서 주소를 변경 및 확인하기 위해 history 객체를 관리하며 필요에 의해 꺼내 쓸 수 있는 유용한 라이브러리다. 실제로 로그인, 회원가입 등의 액션을 관리하면서도 바로 페이지를 이동할 수 있게 도와줘서 굉장히 편하다. 한참을 v6 지원 방법이 없나를 헤..

❌Auth (9.6.6): INTERNAL ASSERTION FAILED: Expected a class definition firebase Authentication 부분을 진행하는데 나타났던 오류다! class definition? 이 뭘까? 싶어서 구글링을 했는데, auth를 import 하는 과정에서 제대로 import 해주지 않아서 생긴 오류였다. firebase config에서 export 해서 가져오려고 했었는데 왜인지 코드가 먹히지 않아서 공식 문서를 보고 차근차근 따라했더니 해결이 되었다! import { getAuth } from 'firebase/auth'; const auth = getAuth();

👩🏻‍💻 Today I Learned 📚 ✨ 블로그 이전! 공부하는 내용들을 기록해보자고 만들었던 워드프레스 블로그가 계속해서 버그가 발생하며 불안정하더니 결국에는 낮시간동안 접속이 안 되는 상황이 발생. 조회수가 엄청 났다싶었더니 계속 플러그인 문제가 발생하고 있었나보다. 그래서 이 중요한 시기에 나는 블로그 이전을 결정했다. 한 두해 하고 말 것도 아니고 계속해서 이런 식이면 곤란하다는 생각에 빠르게 이전을 결정. 그리고 이전 작업에 착수했다! 다 가져올 생각도 아니고 워드프레스 블로그를 바로 폐쇄할 수 없기때문에 이전을 알리는 글을 적어두고 여기에도 한동안은 워드프레스 블로그를 연동시켜 둘 생각이다. +추가) 도메인 관리자와 이야기를 했는데, 블로그에 있는 글 자체를 살릴 수가 없다고한다. 아니 무..

❌ Warning: Can’t perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function. ❌ 언마운트 된 컴포넌트에서는 상태를 추적할 수 없고, 상태를 추적하지 않기에 작업이 수행되지는 않지만, 메모리 누수가 발생할 수 있으니, useEffect의 cleanup 함수를 이용해라 react로 작업을 하다보면 종종 만나는 에러 중 하나입니다. 이 에러는 fetch 등 비동기를 실행하는 실행..