728x90

현재 타입스크립트 기반으로 react를 학습중에 있는데

 

리듀서가 햇갈려서 글로서 쓰면서 속풀이를 하려고한다

코드 같은건 없이 글로써만 써보자.

 

우선. 

 

플럭스 부터 올라가서 이야기해야한다

페이스북(현재 메타)가 리액트를 발표할때, 

리액트는 플럭스라는 앱 설계 규격으로 만들었다고 한다.

 

그러다보니 리액트에 도움될 라이브러리도 이 규격을 따라서 만든게 많은데

그중  제일 대표가 되는게 리덕스 라고 한다 

 

리덕스는 앱 수준 상태 관리 패키지라고하는데

어떤 상태(state)를 특정 컴포넌트만 쓰는게아니라 여러 컴포넌트에 공유할 수 있게 만드는 방식이다

 

그러니까... 다양한 컴포넌트에서 가져와서 쓸수있고

useState를 대신하여 쓸수도 있다 따라서 랜더링에도 관여할 수 있다. (dispatch 사용)

 

그렇게 공유하고, 상태를 변경도 하기위해서는

 

리덕스는 저장소(store)가 필요한데 이는 크게 두가지 방식으로 만든느것 같다

1. RTK 패키지에 있는 configureStore 메서드를 이용하여 만드는 방법과,

2. redux 패키지에 있는 createStore 메서드를 이용하여 만드는 방법 두개인것 같다

 

근데  1번 방식이 선호된다고 한다 기능도 좋고

 

dispatch가 호출되면

리듀서가 새로운 상태를 리턴하고

이를 리덕스의 스토어(저장소)에 저장함으로서 랜더링이 일어나는것같다

 

저장을 했다면

 

전역개념으로 저장된거니, 필요한 곳에서 useSelector 훅으로 원하는걸 꺼내서 사용할 수 있다

 

그리고 이 리듀스같은 기능도 리액트의 컨텍스트의 기능이 기반이된다고한다

따라서 리듀스를 사용하라면 App.tsx, App.jsx 쪽에서 항상 최상위 레벨로 존재해야한다

그래야 전역으로 저장하는것도 의미가 통한다

 

 

그렇다면 useReducer 훅은 해당 컴포넌트에서만 존재하는 지역변수개념으로 생각하면된다.

 

마치~~~~~~~~~

spring 에서

 

request Scope, Session Scope, Application Scope 를 보는것 같다

 

 

근데 전역이나 지역이나 뭔차이가 있나싶긴하다

api를 더 잘만들어서 정보를 내려주면 되지 않을까?

똑같은 리듀서를 만드는 중복코드는 줄여줄것같은데...

 

더 공부해보자

 

 

728x90

+ Recent posts