Redux 키워드

액션(Action)

• 상태의 어떠한 변화가 필요하게 될때 우리는 액션이란것을 발생시킨다
• 액션이란 상태를 업데이트할때 우리가 어떻게 업데이트를 해야할지 정의하는것

{
	// 리덕스에서 상태를 업데이트할때 타입을보고 어떻게 업데이트할지 정함
	type: "ADD_TODO",
	// Type외에도 다른값을 넣을수 있음
	data: {
		id:0,
		text:"리덕스 배우기"
	}
}

// or

{
	type: "CHANGE_INPUT",
	text: "안녕하세요"
}

// or

{
	type: "TOGGLE_VALUE"
}

액션 생성함수(Action Creator)

• 액션을 만들어주는 함수 파라미터를 가져와 객체를 만들어주는 함수
• Redux를 사용하면서 액션생성 함수를 사용하는 것은 필수적이지 않음 하지만 만들어두면 나중에 좀더 편하게 코딩을 할수 있고 액션 생성함수를 만들어두지 않는다면 나중에 액션을 생성 할때마다 액션 객체를 만들어야하는 불편함이 있음

export default function adTodo(data) {
	return {
		type: "ADD_TODO",
		data
	};
}

// 화살표 함수로도 만들수 있음
export const changeInput = text +> ({
	type: "CHANGE_INPUT",
	text
});

리듀서(Reducer)

• React-Hook의 useReducer과 완전이 같음 Redux의 Reducer
• Reducer 은 2가지 파라미터를 가지고옴(state, action)
• 불변성을 지켜줘야함(기존의 객체나 배열을 건드리지 않고 새로운 객체나 배열을 만들어 반환)
• useReducer을 사용할때는 default에 에러를 발생시키는게 일반적 이지만 Redux-reducer에서는 기본 값 을 반환함 Redux를 사용할때 여러개의 Reducer을 만들수있고 여러개의 Reducer을 합쳐 rootReducer를 만들수 있음 rootReducer안에 작은 Reducer은 ServeReducer(서브리듀서) 라고 부름

 function counter(state, action){
	switch (action.type){
		case "INCREASE":
			return state + 1;
		case "DECREASE":
			return state - 1;
		default
			return state;
	}
}

스토어(Store)

• Redux를 사용한다면 한 프로젝트는 하나의 Store를 가질수 있고 Store안에는 Reducer과 현제 상태를 가지고 추가적으로 몇가지 내장함수를 가지고있음
  • Store의 내장함수
    • 디스패치(dispatch)

      • 액션을 발생 시키는것 or 액션을 스토어에 전달

      • 액션 객체를 만들어 dispatch파라미터에 넣어서 호출해주고 호출을하면 해당 액션이 Store안에 있는 Reducer에 전달이되고 Reducer함수에서는 새로운 상태를 반환해주고 Store의 상태가 업데이트됨

        dispatch({ type: "INCREASE" })

    • 구독(subscribe)
      • subscribe를 호출할때 파라미터로 특정 함수를 넣어주면은 Action이 dispatch될때마다 우리가 설정한 함수가 호출됨
      • 잘 사용하지 않음

요약

• 액션 상태업데이트를 해야할때 어떻게 업데이트를 해야하는지에 대한 정보를 가지고 있고 타입값은 필수로 가지고 있어야함
  
• 액 션생성함수 액션 객체를 만들어주는 함수 필수는 아님
  
• 리듀서 새로운 상태를 만들어주는 함수이고 2가지 파라미터를 받음 State, action(현제 상태, 새로운상태)
  
• 스토어 현제 앱의 상태와 Reducer를 가지고 있고 하나의 앱에는 하나의 스토어만 가질수 있고 2다수의 내장함수를 가지고있음(디스패치, 구독)
  

리덕스의 3가지 규칙

1. 하나의 애플리케이션엔 하나의 스토어만 가질수 있음

   여러개의 스토어를 가질수도 있지만 일반적인 방법은 아님 스토어가 여러개일때 개발자도구를 활용할수 없음

2. 상태는 읽기전용

   읽기 전용인 이유는 불변성을 지키기 위해서

3. 변화를 일으키는 함수 리듀서는 순수한 함수여야 한다

   리듀서 함수는 이전 상태와, 액션 객체를 파라미터로 받음 이전의 상태는 절대로 변경하지 않고 변화를 일으킨 새로운 상태 객체를 만들어서 반환함 똑같은 파리미터로 호출된 리듀서 함수는 언제나 똑같은 결과값을 반환해야만 함

Redux Ducks 패턴

Action 파일과 Reducer 파일을 하나의 파일로 몰아서 작성하는 디자인 패턴