ErrorNote

ErrNote] (리액트 애니메이션처리) 리렌더링 시 애니메이션이 되지 않을 때

리액트 리 렌더링 시 애니메이션이 되지 않을 때 처리 방법 리액트에서 간단하게 애니메이션을 구현하다 첫 렌더링 시 애니메이션이 정상 작동하지만 데이터를 새롭게 받아와 리 렌더링이 되었을 때 애니메이션 효과가 적용이 안 되는 이슈가 발생했습니다! 해결한 방법은 애니메이션 효과를 적용해야하는 컴포넌트에 key값을 추가하여 해결하였습니다! key값을 추가하기 전 애니메이션 효과가 적용되지 않은 이유 리 렌더링 시 리액트는 내부 콘텐츠만 변경하게 됩니다. 이때, key를 추가하면 key가 변경될 때 다른 엘리먼트로 인식하기 때문에 애니메이션 효과가 적용됩니다!

NestJs] (git) cannot add to the index -missing -add option

NestJS 깃허브 커밋 에러 NestJS를 커밋하는데 cannot add to the index -missing -add option 로그가 발생하여 커밋이 되지 않는 현상이 발생하였습니다. NestJS프로젝트를 생성 시 루트 폴더에 git폴더가 숨어져 있는데 맥북 기준으로 해당 폴더에서 커맨드 + 쉬프트 + . 을 입력하여 숨김 폴더를 볼 수 있게 한 후 숨김 폴더를 삭제 후 다시 커밋을 하면 커밋이 정상적으로 동작합니다!

ErrorNote] Heroku remote rejected 해결

참고 사항 server와 client가 하나의 repo에 존재했을 때 해결한 방법입니다. 해결 방법 // 1. heroku 로그인 heroku login // 2. 로그인이 완료되면 heroku를 가르키게 만든다. heroku git:remote -a 'heroku 앱 이름' // 3. 루트 폴더에 접속한 후 git subtree push --prefix server heroku master

ErrorNote] Invalid Hook Call Error

원인 1) Mismatching Versions of React and React DOM 리액트 돔의 버전이 훅을 16.8.0보다 낮을 때 에러가 뜰 수 있습니다. 프로젝트를 어느 정도 진행하다 Invalid Hook Call Error가 뜬다면 보통은 Invalid Hook Call Error가 버전 때문에 나오는 에러는 아니지만 혹시 모르니 package.json에서 한번 확인해보시는게 좋습니다. 원인 2) Breaking the Rules of Hooks Hooks를 호출 할 때 함수형 컴포넌트의 최상위 부분에서 호출해야 합니다. 총 3가지의 경우가 존재하는데 아래에서 예시를 살펴보겠습니다. //1. 클래스형 컴포넌트안에서 호출한 경우 class example extends React.Compone..

ErrorNote]Unknown column '' in 'field list'(Sequelize)

오류가 난 원인 오류가 발생했던 것은 기존에 로그인 한 유저가 아니어도 글을 작성할 수 있을 때는 오류가 없이 잘 진행이 되다가 로그인을 한 유저만 글을 작성할 수 있게끔 코드를 리팩토링 했을 때 Unknown column '' in 'field list' 오류가 발생했습니다😭 오류의 원인은 기존의 DataTable column에서 username이 추가되었던 게 원인이었습니다! 해결 방법 전에 생성했던 DataTable을 Drop을 해서 오류를 해결했습니다!

ErrorNote] 이미지가 렌더링 되지 않는 현상

//------------------------수정 전----------------------------------- const { reviewImage, reviewContent } = useSelector((state) => ({ reviewImage: state.review.list.reviewImage, reviewContent: state.review.list.reviewContents, })); React.useEffect(() => { dispatch(getOneReviewDB(reviewId)); }, []); //--------------이미지를 때에 따라 못 받아 오는 문제----------------------- //--------------------------------------..

ErrorNote] 리액트&리덕스 토큰이 정상적으로 들어오지 않는 현상

export const logInDB = (user_info) => async (dispatch, getState, { history }) => { const username = user_info.username; const password = user_info.password; try { const login = await instance.post('/login', { username, password, }); const login_info = { token: login.data.token, username: login.data.username, }; ------------------------------ //dispatch(SetUser(login_info)); //history.replace('/'..