리액트 상태관리
-
React Redux 리액트 리덕스란?React 리액트 2023. 9. 21. 14:25
리덕스란 JavaScript 상태관리 라이브러리이다. 리덕스의 본질은 Node.js 모듈이다. 리덕스는 쉽게 설명하면 상태 관리의 로직을 컴포넌트 밖에서 처리 하는 것이다. 리덕스를 사용하면 스토어라는 개체 내부에 상태를 담게 된다. 액션(Action) : 상태 변화를 일으킬 때 참조하는 객체이다. - const mapActionToProps = (dispatch) => { } 함수 사용 - Action이라는 단어는 Event와 같다고 생각하면 된다. - dispatch 인수에서 Ruduce로 넘길 객체(type)를 정의한다. - Action이 실행되고 끝나면 type을 반환하는데 type은 Reduce로 전달된다. 스토어(Store) : 애플리케이션의 상태 값들을 내장하고 있다. - 리덕스에서는 단 하..
-
컴포넌트(5) 리액트 훅(react hook)사용 - useReducerReact 리액트 2023. 9. 7. 11:18
1. useReducer 훅이란? - useReducer은 상태를 관리하고 업데이트하는 훅인 useState를 대체할 수 있는 함수이다. - 한 컴포넌트 내에서 State를 업데이트하는 로직 부분을 그 컴포넌트로부터 분리시키는 것이 가능하여 코드의 최적화 할 수 있다. 기본형 const [state, dispatch] = useReducer(reducer, initialState); state : 현재 상태 dispatch : action을 발생시키는 함수 reducer : state와 action를 받아 새로운 state를 반환하는 함수 initialState : 초기값 같은 로직을 각각 useState훅과 useReducer를 사용하여 비교해보는게 이해가 빠르다. App.js import Counte..