React -3

SPA(Single Page Application) -React

-단일 페이지 응용 프로그램을 의미. 즉, 한 번의 페이지 로드 후에 모든 필요한 리소스를 다운로드하여 이후에는 페이지를 다시 로드하지 않고 동적으로 콘텐츠를 업데이트한다.

MPA(Multi Page Application)

-MPA는 여러 페이지로 구성된 전통적인 웹 애플리케이션을 의미. 각 페이지는 서버로부터 별도의 HTML 파일을 받아서 렌더링한다.

ref: DOM에 이름달기

1.DOM을 꼭 직접적으로 건드려야 할 때
2.컴포넌트 내 변수 변호가 필요할 때

1)createRef를 통한 ref설정

2)input에 ref달기

3) 컴포넌트에 ref 달기
-컴포넌트 내부에 있는 DOM을 컴포넌트 외부에서 사용할 때

<MyComponent re={(ref) => {this.myComponent=ref}}
  />

4)useRef()
-current 속성 통해 접근

컴포넌트 반복

자바스크립트 배열의 map() 함수
(map은 새로운 배열을 반복)
데이터 -> JSX 반복

const listItems = items.map((item) => <li>{item.title}</li>);

2. 데이터 배열을 컴포넌트 배열로 반복하기

react-Icons

react-icons라이브러리 -> svg이미지

yarn add react-icons