리액트14 [React]Link컴포넌트 사용 시 TypeError TypeError: Cannot read properties of undefined (reading 'pathname') ... import { Link, withRouter } from 'react-router-dom'; ... class Search extends Component { ... goToMovie = () => { const { movieTitle } = this.state; const { history } = this.props; if (0 < movieTitle.length) { history.push('/movies'); } else { alert('영화 이름을 입력하세요'); } }; ... render() { return ( ); } } const SearchButton = st.. 2021. 10. 31. [Team project] 🍿MEGAFOX 🎞 - 회고 MEGAFOX 팀 프로젝트 📆 진행 기간 2021.10.18 ~ 2021.10.29 💻 기술 Front-end View : React Build Tool : Create React App Library : react-router-dom Styled Components (with css3, sass) Code Quality Tool : ESLint, Prettier Back-end Python, Django, MySQL Infrastructure : AWS 🖇 사용 협업 툴 VCS : Git & Github Communication : Slack Task Management : Trello 🦊 팀원별 역할 Front-end github 공통 CRA 초기 세팅 강단 header(Nav, 유저 정보 등 확인 .. 2021. 10. 31. [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. [Team project] ⚾️BBADDA 💢 - 회고 기존 MLB korea 사이트를 프론트엔드는 React를 백엔드는 Django/Python를 사용해 재구성해보았습니다. BBADDA 팀 프로젝트 📆 진행 기간 2021.10.05 ~ 2021.10.15 💻 기술 Front-end View : React Build Tool : Create React App Library : react-router-dom Code Quality Tool : ESLint, Prettier Sass Back-end Python, Django, MySQL Infrastructure : AWS 🖇 협업 툴 VCS : Git & Github Communication : Slack Task Management : Trello ⚾️ 팀원별 역할 Front-end github 공통 CRA.. 2021. 10. 18. [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]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 다음
