D.evelop/React, Next.js21 [React]map함수 unique "key" prop 에러(Fragment에 속성 적용) Warning: Each child in a list should have a unique "key" prop. React에서 map함수를 사용하는 것에 재미가 들려 여기저기 사용해보던 중. 다음과 같은 코드에서 에러가 지속되었다. index.js:1 Warning: Each child in a list should have a unique "key" prop. {NAV_DATA.map(({ id, name, link, menu }) => { return ( this.setHoverMenu(id)}> {name} {id === hoveredMenuId && } ); })} 이리보고 저리보고 다시 봐도 나는 '각 자식 요소에 유니크한 키 값 key={id}부여하고 있었다. (고 생각했다.) ✅ map 함수.. 2021. 10. 23. [React]라이프사이클 Lifecycle (+unique key prop에러) Lifecycle 리액트 라이프 사이클 (링크) componentDidMount() componentDidMount()까지는 DOM에 없다 componentDidMount()이 선언되는 순간부터 사용할 수 있음 일회용. 한번만 불리고 땡! Re-render의 조건 setState가 업데이트 됐을 때 props가 바꼈을 때 "리렌더"가 된다. 기본 LifeCycle 컴포넌트 생성 시 construct > componentWillMount > render > componentDidMount 순으로 진행 컴포넌트를 제거할 때는 componentWillUnmount 메소드만 실행 컴포넌트의 prop이 변경될 때 componentWillReciveProps > shouldComponentUpdate > compo.. 2021. 10. 6. [React]terminal에서 npm종료 할 때, 단축키 "ctrl + c" React 프로젝트 중에 페이지 확인하느라 터미널에서 npm start 시키다가 수정 후 git으로 commit 할 때 git명령어가 실행 안돼서 당황.... 터미널을 종료했다가 다시 켜서 commit을 하는 걸 4번 정도 했을 때 방법을 찾았다. 구글링 키워드 'npm 종료' terminal에서 npm종료 할 때, 단축키 "ctrl + c" 2021. 9. 27. [React]에러 "Module not found: Can't resolve 파일 in 경로'' React Router 모듈을 추가했다. npm install react-router-dom --save sass 모듈을 추가했다. npm install node-sass@4.14.1 --save 클론 중이던 danstagram의 메인페이지에서 에러가 떴다. Module not found: Can't resolve 'css파일' in 'css파일 경로' ..........(중략).......... [현상] login페이지에서는 css가 읽히는데, main 페이지에서는 읽히지 않았다. login.css를 login페이지에 인클루드하면 적용 됨 main.css를 login페이지에 인클루드하면 적용 됨 main.css를 main페이지에 인클루드하면 적용 안됨 loing.css를 main페이지에 인클루드하면 적.. 2021. 9. 22. [React]CRA설치 에러 A template was not provided. This is likely because you’re using an outdated version of create-react-app. 왜? 왜 나만 뭐 설치하려고 할 오류나?😂 또 오류나면 다시 보려고 적어두는 기록✍️ (오류가 그래요. 해결했던 기억을 잊어 갈 때 쯤, 다시 찾아오더라고요.) 먼저 주어졌던 과제를 정리하면 ✔️ node.js 설치 ✔️ npm 설치 ✔️ create-react-app 설치 이렇게 준비해야 했다. [첫 실패🤯] // node.js 버전 확인 node -v // npm 버전 확인 npm -v 우선 기존에 설치되었는지 확인하려 버전을 체크하니 지난 버전이 설치되어 있는 걸 확인하고 패스. (어쩌면 이게 문제의 시발점이었다. '왜? 설치돼있지?'하고 의문을 안가진 것) ✨ 설치 방법 ✨ // 1. 설치할 경로로 진입 cd 설치할 디렉토리 경로 // 2. create-react-app 설치 npx create-.. 2021. 9. 21. 이전 1 2 3 다음
