#npm
npm install redux --save
npm install react-redux --save
#yarn
yarn add redux
yarn install react-redux --save
src/store
리덕스 폴더다.
src/store/index.js
액션 함수들이 저장된 파일이다.
src/store/cartReducer.js
리듀서파일들이 저장되어있는 파일다.
src/store/rootReducer.js
리듀서들을 합쳐주는 파일이다.
export const addCart = item => {
return {
type: "ADD_ITEM",
payload: item,
};
};
export const deleteCart = item => {
return {
type: "DELETE_ITEM",
payload: item,
};
};
const cartReducer = (state = INITAL_STATE, action) => {
switch (action.type) {
case "ADD_ITEM":
return [...state, action.payload];
case "DELETE_ITEM":
return [...action.payload];
default:
return state;
}
};
export default cartReducer;
const INITAL_STATE = [
{
isChecked: true,
product_name: "초기값",
},
];
import { combineReducers } from "redux";
import cartReducer from "./cartReducer";
export default combineReducers({ cartReducer });
import { Provider } from "react-redux";
import { createStore } from "redux";
import rootReducer from "./store/reducers";
const store = createStore(rootReducer);
ReactDOM.render(
<React.StrictMode>
<Provider store={store}>
<Routes />
<GlobalStyle />
</Provider>
</React.StrictMode>,
document.getElementById("root")
);