개발하는 루루언니

redux 셋팅 본문

컴퓨터 정보/리액트

redux 셋팅

혜닝혜루 2022. 11. 1. 20:51
728x90
반응형

 

< store >

import { createStore,  applyMiddleware} from "redux"

import thunk from  "redux-thunk"
import {composewithDevTools} from "redux-devtools-extension"

let store = createStore(rootReducer,     composewithDevTools   (applyMiddleware(thunk)) )

해석

 

1. store안에는 첫번째 reducer이 들어감

 

2. api 호출을 위한 어플라이 미들웨어 

 

3. 넣어줄 미들웨어는 thunk다

 

4. 쉽게 개발을 하기 위한 툴 > devtool을 이용하기위해  composewithDevTools 의 매개변수를 미들웨어를 넣어준다.

 

 


redux 폴더안에 reducer 폴더를 만들어주고 index.js를 만든다. 

------------>rootReducer 을 가져오는 작업

combineReducers 는  여러개의 reducer을  하나로 합치는 작업을한다.

<reducer > 폴더안에 index.js 
import {combineReducers} from "redux"

export default combineReducers({})

 

 

combineReducers은 항상 객체가 들어갑니다. 객체안에 reducer을 여러개 만들거입니다.

 

 


store " root Reducer을 reducer 폴더안에 있는 앞으로 만들 index 애들로 불러옵니다)
import { createStore,applyMiddleware} from "redux"
import thunk from  "redux-thunk"
import {composewithDevTools} from "redux-devtools-extension"
import rootReducer from "./reducers"

let store = createStore(rootReducer,composewithDevTools(applyMiddleware(thunk)) )
728x90