초기 환경 구축
npx create-react-app "tsredux" --template typescript
초기 패키지 설치
npm i redux @types/redux react-redux @types/react-redux
npm i redux-thunk @types/redux-thunk
npm i axios
리덕스 구축 순서
// PokemonReducer.ts
const PokemonReducer = (state=initialState, action:any) => {
switch (action.type) {
default:
return state;
}
}
export default PokemonReducer;
// index.ts
const rootReducer = combineReducers({
PokemonReducer
});
export default rootReducer;
// Store.ts
import {createStore, applyMiddleware } from "redux";
import rootReducer from "./reducers/index";
import thunk from "redux-thunk";
const store = createStore(rootReducer, applyMiddleware(thunk));
export default store;
// index.tsx
import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
import { Provider } from "react-redux";
import store from "./Store";
ReactDOM.render(
<React.StrictMode>
<Provider store={store}>
<App />
</Provider>
</React.StrictMode>,
document.getElementById("root")
);