관리 메뉴

CASSIE'S BLOG

[슈퍼코딩] 73-1강 Redux - 4 본문

PROGRAMMING/슈퍼코딩 강의 정리

[슈퍼코딩] 73-1강 Redux - 4

ITSCASSIE1107 2023. 12. 24. 16:47
반응형

복습

Action에 payload를 전달하면 더 복잡한 로직을 처리할 수 있다.

여러 개의 속성을 state에서 관리할 수 있다. 이 때 reducer가 실행될 때마다 state는 덮어씌어지므로 주의해야한다. ( 그래서 reducer만들 때 주의해서 만들어야한다.)

원래는 액션에 타입만 넣어서 지정해줬었다.

Redux Toolkit 개념 및 사용법
불변성 (중요한 개념이라고 함)

리액트에 리덕스를 사용하면서 프로젝트가 커지면 여러가지 이슈가 발생(불변성 관리)

필수는 아니지만 리액트 리덕스를 사용한다면 권장한다고 함

어떻게 하면 코드를 간결하게 쓸 수 있을까 고민해봐야한다고함.

코드를 파악하는데 시간을 잘 잡아먹는다고 함

로직을 한 두개 만들고 내가 이 로직을 100개 만들었을 때 어떻게 하면 헷갈리지않고 유지보수를 할 수 있을까 그런 고민들을 해봐야한다고함.

이건 누구도 안 알려주는 부분이라고 함

프로퍼티가 몇개 없어서 빠졌네 하면 되는 부분이지만

프로퍼티가 수십 개 있고 이 프로퍼티를 다루는 이 프로퍼티를 다루는 props, 이 상태를 다루는 타입이 수 십개가 있을 때 속성 하나하나 빠질 때 마다 그거를 다 추가할 수 있을까요?

RTK

createSlice: 리듀서와 액션을 편리하게 관리할 수 있게 도와준다.

여기서 actions을 설정하면 각 컴포넌트에서 바로 디스패치해서 쓸 수
있다.

configureStore: 여러개의
리듀서를 하나의 스토어에서 관리할 수 있게 해준다.

리듀서는 후라이팬 같은 거네..

리덕스(Redux)는 상태 관리 라이브러리로, 애플리케이션의 상태를 예측 가능하고 디버깅이 용이하게 관리하는 데 사용됩니다. 리덕스는 세 가지 핵심 개념으로 구성됩니다: 액션(Action), 리듀서(Reducer), 그리고 스토어(Store).

액션(Action): 액션은 어떤 변화가 일어났는지를 나타내는 객체입니다. 주로 type 속성을 가지고 있어 어떤 종류의 액션이 발생했는지 식별합니다. 다양한 액션을 정의해 애플리케이션의 상태를 어떻게 변경할지 결정합니다.

리듀서(Reducer): 리듀서는 현재의 상태와 액션을 받아서 새로운 상태를 반환하는 순수 함수입니다. 순수 함수는 같은 인풋에 대해 항상 같은 아웃풋을 반환하며 부작용이 없어야 합니다. 이러한 특성은 애플리케이션 상태의 예측 가능성과 디버깅 용이성을 높여줍니다.

스토어(Store): 스토어는 애플리케이션의 상태를 담고 있습니다. 스토어는 createStore 함수를 사용하여 생성되며, 액션을 디스패치하면 리듀서가 호출되어 새로운 상태를 생성하고 이를 스토어에 저장합니다.

이 전에는 action.type=‘blahblah’
이렇게 직접 하드 코딩을 했는데 그거를 할 필요가 없어짐

공식문서에 다 적혀있음 이런 식으로 속성을
이렇게 넣어준다는 거임

const slice = createSlice({


reducers : {
}

})


slice.actions.increment(payload 내용들 그냥 쓰면 된단다)

반응형