고양이발일기
Redux 다시 정리하기(1) 본문
Redux란?
- '상태관리 라이브러리' 이다.
Redux 를 왜쓰는가?
- 컴포넌트 구조가 복잡할 경우 매우 유용하다.
- global state 관리가 쉽다.
ㄴglobal state와 local state가 있다. 예를 들자면, 인스타그램의 경우 global state는 유저가 로그인을 했는가? 정도를 들 수 있고 local state 는 한 게시글에 좋아요를 눌렀는가? 정도로 생각하면 된다.
Redux를 사용하지 않을때,
A라는 컴포넌트에서 함수를 실행시켜 B컴포넌트에 있는 props를 변화 주고 싶다면
Root -> A의 상위 컴포넌트 들 -> A -> A의 상위 컴포넌트 들 -> Root -> B의 상위 컴포넌트 들 -> B
이런 식으로 가야한다.
이 방식에서 오는 단점은
1. 해당 props를 사용하지 않는 컴포넌트를 거쳐가야해 리렌더링시 비효율적이다.
2. props의 이름을 바꿔주게 된다면 하위 컴포넌트 모두 일일히 바꿔줘야 한다.
Redux를 사용하게 된다면,
store을 한 파일로 두게 되어 A와 B 컴포넌트를 다른 컴포넌트를 거치지 않고 한번에 이을 수 있다.
여기서 store란 , 다음에 더 자세히 쓸 것이지만 프로젝트가 가지는 '상태' 와 '상태변화 로직' 을 담고 있는 것이다.
store을 사용하게 된다면, 부모-자식간의 컴포넌트 끼리의 데이터 교류가 아닌 global state를 다루기가 쉬워진다.
Redux의 기본 규칙
1. 상태를 수정하는 것이 아니라 새로운 상태를 생성하여 업데이트한다.
2. 하나의 애플리케이션에는 하나의 스토어만이 존재한다.
3. Reducer는 순수함수여야한다.
ㄴ 똑같은 파라미터로 받아온 함수는 같은 결과값을 반환해야한다.
'개발 일기' 카테고리의 다른 글
AWS 정적 웹사이트 호스팅 (1) (0) | 2021.07.14 |
---|---|
Django 시작하기 (0) | 2021.07.13 |
SASS( SCSS )가 궁금해서 찾아봤다냥 (0) | 2020.05.23 |
Redux 다시 정리하기(3) (0) | 2020.05.22 |
Redux 다시 정리하기(2) (0) | 2020.05.22 |