hmk run dev

리덕스 본문

React

리덕스

hmk run dev 2021. 3. 20. 19:25

리덕스란? 상태를 관리해주는 것

데이터를 관리한다는 뜻

 

아래 코드로 인스톨

 

yarn add redux react-redux

 

 

1. State

데이터 리덕스에서 저장하고 있는 상태값

 

2. Action

상태에 변화가 필요할 때 발생함

 

3. ActionCreator

액션을 만들기 위해 사용

 

4. Reducer

리덕스에 저장된 데이터를 변경하는 함수

액션 생성함수 콜 > 액션만듦 > 현재상태를 받아서 > 다른 데이터로 리턴

 

5. Store

우리가 데이터를 볼 수 있게 도와주는 친구

 

6. dispatch

우리가 많이쓰게 될 내장함수 정~~말 많이쓴다 액션을 발생 시키는 역할

 

세가지 특징

 

store는 1개만 쓴다 // 무조건 1프로젝트 당 1개의 스토어

 

store의 state는 오직 action으로만 변경 가능하다

// 리덕스에 저장된 데이터는 읽기전용이라고 볼 수 있다

 

어떤 요청이 와도 리듀서는 같은 동작을 해야한다

함수가 받아오는 파라미터 외의 값엔 의존하지 않는다 >

파라미터가 같으면 항상 같은 값을 리턴해준다

 

컴포넌트와 리덕스의 관계도

 

  • (1) 리덕스 Store를 Component에 연결한다.
  • (2) Component에서 상태 변화가 필요할 때 Action을 부른다.
  • (3) Reducer를 통해서 새로운 상태 값을 만들고,
  • (4) 새 상태값을 Store에 저장한다.
  • (5) Component는 새로운 상태값을 받아온다. (props를 통해 받아오니까, 다시 랜더링 되겠죠?)
  •  

 

'React' 카테고리의 다른 글

state 연습 + 코드 상세 해석  (0) 2021.03.21
React prac 내장함수 라이프 사이클  (0) 2021.03.21
라우팅  (0) 2021.03.20
라이프 사이클이란??  (0) 2021.03.19
styled 컴포넌트 이쁘게만들기  (0) 2021.03.19
Comments