리덕스는 채팅이라고 생각하면 된다
리덕스에는 스토어라는 저장소가 있다(상태를 저장하는 곳이다)
뭔가 쏘려면 dispatch를 이용한다.
dispatch가 쏴주는건 action이다. (원래 action은 명사지만 js에서는 동사도 가능)
받는사람은 useSelector를 이용하는사람이다.
리덕스에서는 reducer가 함수이기떄문에 비동기처리를 하기위해서 redux-thunk 라는 미들웨어를 이용한다.
redux 에서 dispatch할 때 action을 던지는데 action은 보통 객체이다.
이 action을 보통 객체로 던지게 되는데 redux-thunk를 이용하면 action을 function으로 던질 수 있게 된다.
redux-thunk에서 젱ㄹ 중요한 아이는 createAsyncThunk이다.
----자바이야기----------
decorator pattern
inputstream은 종류가 다양하다.
ImputStream in = System.in // byte단위로 읽는다.
BufferdInputStream bin = newBufferdInputStream (in); //속도를 올리기위해 버퍼링을 해주는 아이를 넣었다
.... 이런 아이들을 객체지향에서는 데코레이터 패턴이라고 한다.
(원래 함수는 특정 기능만 가지고 있는데 합체하고 결합하면서 점점더 많은 기능을 가지게 되는것)
-----------------------------------------------------------------------------------------------------------------
원래 함순데 함수를 감싸는 함수를 고차함수라고 한다.
createAsync를 하면 뭔가 감싸여서 나온다.
thunk에서는 pending, fulfilled, rejected 라는 함수에 감싸여서 나오는데
pending은 비동기를 실행중일때 어떤기능을 추가하도록
1. createAsyncThunk로 감싼다
2. slice를 만든다
3. store에 slice를 추가한다.
4. slice에 extraReducers라는것을 추가한다.
5. 이 안에는 addCase라는것으로 특정상황에서 반환되는 값들을 정의할 수 있다.
const asyncSlice = createSlice({
name:"asyncSlice",
initialState:initState,
extraReducers: builder => {
builder
.addCase(asyncGetTime.pending, (state, action) => {
return {msg: "loading..."}
})
.addCase(asyncGetTime.fulfilled, (state, action) => {
return {msg: "Finished....."}
});
}
});