[TIL]23-08-24

hyein·2023년 8월 24일
0

TIL

목록 보기
29/34
post-thumbnail

상태관리란?

상태관리란?

->데이터를 관리하는 방법

상태관리를 하는 이유?

->서비스의 규모가 커질수록 관리해야할 데이터가 많아지고 이를 체계적으로 관리하기 위해 상태 관리라는 라이브러리를 사용한다.

state의 불편함

조부모 컴포넌트에서 손자 컴포넌트로 값을 보내고자 할때도 반드시 부모 컴포넌트를 거쳐야만 한다. 즉, 정작 부모컴포넌트에서는 그 값이 필요가 없어도 단순히 손자 컴포넌트에게 전달하기 위해 불필요하게 거쳐야만 하는 것을 의미한다. (조부모 → 부모 → 손자)

리덕스를 사용하면 State를 공유하고자 할때 부-모 관계가 아니여도 되고, 중간에 의미없이 컴포넌트를 거치지 않아도 됩니다. 그리고 자식 컴포넌트에서 만든 State를 부모 컴포넌트에서도 사용할 수 있게 됩니다.

Local State / Global State

  • Local state (지역상태) 란?
    • 컴포넌트에서 useState를 이용해서 생성한 state 입니다. 좁은 범위 안에서 생성된 State 라고 생각하시면 됩니다.
  • Global state (전역상태)란?
    • Global state는 컴포넌트에서 생성되지 않습니다. 중앙화 된 특별한 곳에서 State들이 생성됩니다. 좀 더 쉽게 얘기해서 “중앙 state 관리소” 라고 생각하면 됩니다.

      리덕스란, 우리가 위에서 말한 “중앙 state 관리소”를 사용할 수 있게 도와주는 패키지(라이브러리) 입니다.

redux 정리

리덕스란 무엇인가?

->리덕스는 모든 state를 store라는 중앙 상태 저장소를 사용하여 앱의 모든 상태를 저장한다. 이 Store는 Reducer 함수를 통해 수정될 수 있다. 또한 이러한 Reducer 함수는 이전 상태와 액션 객체를 dispatch로 입력으로 받아 새로운 상태를 반환한다.

리덕스를 쓰는 이유?

->모든 상태 업데이트를 액션으로 정의하고, 액션 정보에 기반하여 리듀서에서 상태를 업데이트하는 이 간단명료한 발상 덕분에, 상태를 더욱 쉽게 예측 가능하게 하여 유지보수 측면에 긍정적인 효과가 있다.


  • 리덕스는 전역상태 관리 라이브러리이다.
  • 리덕스는 useState를 통해 상태를 관리했을 때 발생하는 불편함을 일부 해소시켜준다.
  • 리덕스는 중앙 State 관리소를 가지고 있으며, 모든 State는 이곳에서 생성된다.
  • useState로 생성한 State는 Local State이고, 리덕스에서 생성한 State는 Global State이다.

redux toolkit

리덕스를 사용하기 위해 작성했던 ducks 패턴의 요소들이 전체적인 코드의 양을 늘린다는 개발자들의 불만이 발생하기 시작했고, 리덕스 팀에서는 이것을 수용하여 코드는 더 적게, 그리고 리덕스를 더 편하게 쓰기 위한 기능들을 흡수해서 만든 것이 리덕스툴킷 입니다. 줄여서 RTK 라고도 합니다.

redux에서는 Action Value, Action Creator, Reducer를 각각 써주어야 했다. rtk에서는 Slice 라는 API를 사용합니다. 이 슬라이스를 사용하면, 저 3개를 각각 만들어줄 필요 없이 한번에 3개가 모두 만들어집니다.

슬라이스는 createSlice 라는 API를 통해 만들 수 있습니다. 그리고 그 인자로 설정정보를 객체로 받는데, 그 안에 우리가 필수로 작성해줘야 하는 값은 name, initialState, reducers가 있습니다.

counterSlice 리듀서 객체 안에서 만들어주는 함수가 리듀서의 로직이 되면서도 동시에 Action Creator가 된다는 점입니다. 그리고 Action Value 까지 함수의 이름을 따서 자동으로 만들어집니다. 그래서 우리는 Reducer만 만들어주면 됩니다.

profile
As I start to move towards the goal, the goal will start to move towards me.

0개의 댓글