-
Q. 리덕스를 사용할 때 모든 state를 store에서 관리하는 것이 맞을까?web/React&Redux 2020. 3. 29. 00:11
상황
이번 프로젝트(4주 프로젝트)에서 어쩌다보니 프론트하게 됐고,
리덕스도 처음 써보게 되었는데
처음 도입했을 때 (리덕스를 빨리 익혀서 써야한다는 부담감 때문에)
별 생각 없이 그냥 앱에서 사용될 모든 데이터를 스토어에 때려 박았다.
팀원 중 한명이 다 스토어에서 관리할 필요는 없고
컴포넌트 내에서 state로 관리할 수 있는 데이터는 store에서 빼는 게 좋을 것 같다?
(뭐가 맞는지는 모르지만..)
라는 의견을 냈다.
그런데 프로젝트 관리/감독 해주시는 분이 리덕스를 사용한다면
모두 스토어에서 관리하는 게 맞다! 라는 말씀을 해주셨다.
당시에는 글쿤, 그렇구나~ 하면서 모든 데이터를 스토어에서 관리하고 있었는데
시간이 흐를수록,, 음,, 이건 모달창 open/close인데 스토어에 보내야 하나..? (결국 안 보냄)
음..,, 이건 input인데 스토어에 꼭 보내야 하나...?
하면서 의문이 쌓이고 있다...
불현듯,, 모두들 어떻게 생각하는지 궁금했고
나는 굳이 여러 컴포넌트에서 사용하는 데이터가 아니라면..
그리고 별로 중요하지 않고, 1회성..?이 짙은 데이터라면
store까지 보내지 않아도 된다고 생각한다.
그래도 모든 데이터를 리덕스 store에서 관리하는 게 더 좋아~! 라는 측의
주장과 근거를 알아보고 싶어서 검색을 시작했다.
리액트에서는 props와 state를 사용해 데이터를 관리한다.
리액트를 사용할 때 프로젝트의 크기가 커질수록
props와 state의 관리가 번거롭다.
그럴 때 데이터를 store에서 관리하는 redux가 도움이 된다.
우선 하나의 stroe에서
app에서 사용하는 데이터를 확인할 수 있다.
굉장히 편리하다.
그런데 리덕스를 사용하면서 궁금한 점이 생겼다.
1. container 레벨을 만들어서 container를 redux와 연결하고
container 아래 level의 컴포넌트는 props로 데이터를 넘겨 준다.
(결국 순수 리액트만 사용했을 때랑 큰 차이가 없는 거 아닌 거 아닌가? 라는 생각이 들었음)
2. input같은 경우는 onChange이벤트가 일어날 때마다 리덕스 store로 갱신하는 게 맞는 것인가?
의견은 분분한 것 같음
I am using Redux. Should I manage controlled input state in the Redux store or use setState at the component level?
I have been trying to figure out the best way to manage my react forms. I have tried to use the onChange to fire an action and update my redux store with my form data. I have also tried creating lo...
stackoverflow.com
개인적으로 모든 것을 Redux 상태로 유지하고 로컬 구성 요소 상태에서 벗어나는 것이 좋습니다. 이것은 본질적으로 ui를 상태의 함수로보기 시작하면 브라우저가없는 테스트를 수행 할 수 있으며 전체 상태 기록 (입력 내용, 입력 내용, 열린 대화 상자 등)에 대한 참조를 유지할 수 있기 때문입니다. 디버깅 목적으로 사용자에게 버그가 발생했을 때 (처음부터 상태가 아님). 클로저의 영역에서 관련 트윗
추가하기 위해 편집 : 이것은 우리와 자매 회사가 프로덕션 응용 프로그램과 redux / state / ui를 처리하는 방식으로 이동하는 곳입니다.\
솔직히 분분하지도 않음;
대부분이 모든 데이터를 리덕스 스토어로 보낼 필요 없다고 말함..ㅠ
모두 리덕스로 보내버려야 한다는 주장을 많이 못 찾았다..
아,, 스택을 고르는 것도 사용하는 것도 보통 어려운 게 아니구나..
쓸 줄 안다고 다 되는 건 아닌 것 같다.
'web > React&Redux' 카테고리의 다른 글
리액트로 간단하게 포트폴리오 사이트 만들기 (0) 2020.04.10 validateDOMNesting(...): <a> cannot appear as a descendant of <a> 에러 핸들링 (0) 2020.03.21 리덕스 개발자 도구와 리덕스 사가 동시에 사용하기 (타입스크립트) (0) 2020.03.20 console.log(FormData)는 왜 빈(empty) 객체인가? (0) 2020.03.17 [React 공식문서 읽기] Main Concepts 2. Introducing JSX (0) 2020.02.15