패스트캠퍼스 데브캠프

김민태의 데브캠프 2기 - Redux

vitamin3000 2024. 11. 19. 12:33

 

정의 :  자바스크립트 애플리케이션을 위한 상태 관리 라이브러리이다.

 

Props

1. properties의 줄임말

2. Props는 구성 요소가 서로 통신하는 방법

3.  props는 상위 구성 요소에서 아래쪽으로 흐른다

4. 해당 값을 변경하려면 자식 관점에서 props를 변경할 수 없고, 부모 내부 상태를 변경해야한다.

 

<ChatMessages
	message={messages}
    currentMumber={member}
 />

 

State

1.  부모 컴포넌트에서 자식 컴포넌트에게 data를 보내는 것이 아닌, 그 컴포넌트 안에서 전달하게 할 때 사용

2.  State is mutable(변하기 쉽다)

3. State가 변하면 re-render 된다.

 

state = {
	message: '',
    attachFile: undefined,
    openMenu: false,
}

 

 

그래서 Redux는 State를 관리하는 것 이다.

 

기존의 Props를 "내려"주는 방법

 

 

Redux 데이터 플로우 (지난 실시간 강의 https://vitamin3000.tistory.com/86)에 자세히 설명했었다.

 

 

 

 

 

Action : JS객체로 수행하는 작업의 유형을 지칭하는 'type' 속성이 있으며, 선택적으로 redux 저장소에 일부 데이터를 보내는데 사용되는 'payload'속성을 가질 수도 있다.

 

Reducer : 리듀서는 애플리케이션 상태의 변경 사항을 결정하고 업데이트된 상태를 변환하는 함수이다.

인수(type)로 조치를 취하고 store 내부 상태를 업데이트한다

{previousState, action) => nextState