React
SPA 개발을 위한 라이브러리. Component기반 개발 방식. CRA 툴을 사용하여 손쉽게 프로젝트 환경 세팅. 제일 많이 사용하는 프론트엔드 라이브러리.
사용법
CRA로 프로젝트 초기 세팅. 기능별로 Component를 만들고 연동. state/props로 각각의 Component끼리 data를 주고 받음.
state/props
state는 Component에서 사용하는 값들로 변경 시 해당 Component가 리렌더링됨.
props는 상위 Component로 부터 전달받은 data로 상위 Component로 data 전달시 사용.
redux
Component가 많아지고 각각의 관계들이 복잡하게 됨에 따라 state 관리가 어려워짐. 이를 해결하기 위해 store라는 것을 만들어 state를 한 곳에서만 관리하기 위한 상태관리 라이브러리.
store/action/reducer로 구성
store에 정의된 action 생성자를 전달(dispatch)하면 store는 action에 해당하는 reducer를 실행하여 state를 갱신하고 view를 갱신함.
redux 개발을 용이하게 하기 위해 여러 라이브러리들이 파생됨. redux-saga, redux-toolkit 등등
ㅎㅎ