React.render (<App/>)
npm i react-dom --save. //save는 default가 됐다 --save-dev < 개발할때만 필요하고 배포할떄는 필요없는애들이면
create-mf-app 으로 다운로드받으면 여러 프레임워크중 선택해서 받을 수 있다.
리액트 파일의 기본은 .jsx 파일이다. 하지만 .js파일도 설정하기 나름으로 돌릴 수 있다.
JSX의 가장 큰 특징은 XML의 공존이다.
리액트에서 컴포넌트는 함수다 (리액트 16이전에는 클래스)
export는 해당 특정 변수만 내보내고
export default는 파일 전체를 내보낸다.
실제로 ES표준에는 import라는 말은 없다(require()가 표준), 하지만 import가 더 편하기 때문에 사용하고
바벨이 require를 import로 변환해준다.
리액트는 저장하눈슨간 바뀐파일이 빌드되는데 이건 watcher가 감시하고있기 때문이다..(nodemon도 watch의 일종이다)
버츄얼돔은 맵이라고 생각해야한다. 바로찾아가기위해 keys를 개발자가 삽입하거나 자동으로 삽입한다.
아무것도 줄것이 없으면 fregment를 줘야한다. 이유는?( React dom은 tree구조이기때문인데 만약 싸주지 않고 다른 반복되는 것들과
keys값이 중복이 날수있기때문이다.
웹팩에서는 분리하는 역할도 해준다. (라우터에서 나중에 받아올 페이지들은 빼고 가져오기 등..)
/// 리액트의 상태관리
상태관리하기위해서는 React의 useState, useRef, useContext가 있다.
setter라는 함수로 정의된 함수들은 뒤에 render()라는 함수를 호출하게한다.
이런구조를 가진 애들은 Hook이라고 한다.
컴포넌트는 대문자로 쓴다 구분하기위해서 대문자로 쓴다.
JSX의 표준은 카멜케이스라고 생각하면댄다
useRef는 참조해서 변한다
'SeSac (2021-08 ~ 2021-12) > React' 카테고리의 다른 글
Life Cycle (0) | 2021.11.27 |
---|---|
useReducer, memo, useCallback (0) | 2021.11.27 |
<Hooks 성능> (0) | 2021.11.23 |
Hooks (0) | 2021.11.20 |
React Hook (0) | 2021.11.18 |