리액트5 [React 리액트] Hook의 개념과 useState React Hook ? ✔️ 버전 16.8에서 새롭게 등장한 개념인 Hook(훅) ✔️ React의 state와 생명주기 기능에 갈고리(hook)을 걸어 원하는 시점에 정해진 함수를 실행되도록 만든 것 ✔️ React Hook의 이름은 모두 use로 시작 ✔️ React Hook은 개발자가 직접 커스텀도 가능한데, 이때도 이름 앞에 use를 붙여서 훅이라는 것을 나타내는 것이 좋음 ✔️ 내장 Hook 제공(useState, useEffect 등) 🌟 특징 • 선택적 사용 : 기존의 코드를 다시 작성할 필요 없이 일부 컴포너트 안에서 Hook 사용 가능 • 직관적인 API 제공 : props, state, context, refs, lifecycle와 같은 React 개념 useState ✔️ 가장 대표적.. 2023. 2. 7. [React 리액트] Module not found: Can't resolve 'web-vitals' 오류 해결 yarn을 통해 react를 실행했더니 오류가 발생했다. Module not found: Can't resolve 'web-vitals' 아주 간단한 해결 방법 - 터미널에 아래와 같이 입력한 뒤 다시 yarn start를 입력하면 compiled successfully를 확인 할 수 있다 :) npm i web-vitals --save-dev 참고: https://stackoverflow.com/questions/65396568/react-js-npm-start-shows-failed-to-compile-web-vitals React JS npm start shows failed to compile web-vitals I'm getting the error: failed to compile -/src/.. 2022. 9. 26. [React 리액트] JSX의 개념 / 역할 / 장점 / 사용법 JSX 개념 - A syntax extension to JavaScript 자바스크립트의 확장 문법 - JavaScript + XML/HTML JSX 역할 - 내부적으로 XML/HTML 코드를 JavaScript로 변환하는 역할(리액트의 createElement()함수가 이 역할을 함) JSX 장점 - 코드 간결 - 가독성 향상 - 보안성 향상(Injection Attack이라 불리는 해킹 방법을 방어) JSX 사용법 - 기본적으로 모든 자바스크립트 문법 지원 - 자바스크립트에서 XML/HTML 섞어서 사용 - 중괄호를 사용하여 자바스크립트 코드를 삽입 ex/ {`이 블로그의 이름은 ${props.name}입니다.`} 2022. 6. 27. [React 리액트] npm install react-router-dom 오류 해결 react를 하면서 router를 설치했다 npm install react-router-dom 하지만 아무 화면도 안 나왔다 오류면 말이라도 좀 해봐... 그래서 접었다 내일이면 되겠지라는 심정으로... 오늘 다시 했더니 오류 메세지가 떴다 A is only ever to be used as the child of element, never rendered directly. Please wrap your in a . 음... 그래~ 뭔지 모르겠고 그냥 json으로 보니까 나의 react-router-dom 버전이 높은 것 같아서 다운그레이드 했다 npm install react-router-dom@5.3.0 해결 완! 이상하다 어제 분명 내가 uninstall 했다가 새로 깔고 난리부르스를 쳤는데 안 더.. 2022. 6. 13. 이전 1 2 다음
