리액트소개
· facebook에서 어떻게 하면 user interface를 빠르고 잘 만들 수 있을지에 대해 고민하다 만들어 짐. 2013 5월 오픈
소스를 공개
- React Native 2015 5월
- 함수형 컴포넌트 HOOKS(in React 16.8) 2019 2월
- SSR(in React 18) 2022 3월
· React: Web Application
- SPA(Single Page Application): 한 페이지 내에서 자유자재로 네비게이션 할 수 있는 것
- CSR(Client Side Rendering): 다운 받은 후 UI가 표기 되는 것
- SSG/SSR(Static Side Generation / ServerSideRendering): 'Getsby', 'NEXT.js' 프레임워크를 사용
하여 구현
React Native: 스마트폰 크로스플랫폼 앱 개발
React + Electron: Desktop Application
· 프레임워크와 라이브러리 차이점
- framework: 만드는데 필요한 모든 것들이 다 제공되는 것(앵귤러, ios, 안드로이드 등)
- Libraries: 프레임워크 보다 좁은 단위의 문제(한가지)를 해결하기 위한 솔루션 단위(리액트 등)
※ Vue는 프레임워크 이지만 경량화된 형태임
리액트 철학
· 리액트를 한문장으로: Renders UI and responds to event
= UI를 보여주고 event에 반응하도록 만들어진 라이브러리
= component
리액트 동작 원리
데이터는 State(내부상태), Props(외부로 부터 전달받은 상태)가 있고 위 두가지를 나타내는 render파트가 있다
상태(State,Props)가 변경될때마다 re-render되며, 실제로 변경된 부분만 화면에 업데이트 된다
댓글