NOW OR NEVER

Typescript redux middleware redux-thunk yarn add axios redux-thunk typescript 지원되서 따로 @types로 설치 안해도 됨 quicktype(https://app.quicktype.io/) 받아오는 json 결과물 무슨 타입인지 확인하는 법 json 결과물 복사해서 입력하면 typescript형태로 변환 가능 AxiosError : axios가 에러났을 때 사용하는 에러 객체의 타입 createAsyncAction : 비동기 작업시 사용하기 편한 액션 생성 함수 export const AsyncAction이름= createAsyncAction( 액션이름들 )(); ThunkAction keyof S : 상태가 지니고 있는 key github a..

리액트 리덕스 미들웨어 사용자 경험 개선 유틸함수 사용하는 이유 : 리액트와 리덕스를 함께 사용하게 될 때 api 연동하게 되는 경우 비슷한 코드를 자주 작성하게 되기 때문이다. redux-thunk에서의 react history Thunk에서 특정 경로로 이동하고 싶을 때 사용 import {createBrowswerHistory} from ‘history’; JSON server rest api를 json 파일로 호출 가능 연습 용이여서 실무에서 사용하면 안됨 json 파일 기반으로 서버 열기(port 4000으로) npx json-server json파일경로 --port 4000 개발 공부하거나 간단한 프로토 타입 만들 때 사용하면 유용 CORS와 webpack DevServer Proxy CORS..

리액트 리덕스 미들웨어 리덕스가 가지고 있는 핵심 기능 리덕스 사용시 미들웨어를 사용하지 않는 다면 context API 등과 다를 것이 없음 액션 -> 미들웨어 -> 리듀서 -> 스토어 액션 디스패치 될 때 미들웨어에서 특정 조건에 따라 무시할 수 있게 할 수 있다(리듀스에서 해당 액션을 처리하지 않는다는 뜻), 액션이 리듀서에 도달하기 전에 처리할 수 있음(액션 수정하거나 콘솔에 나타나게 함) 주로 비동기 작업을 처리 할 때 사용(redux-thunk, redux-saga) ex) API 요청 일반적으로 라이브러리로 만들어진 리덕스 미들웨어 사용 ex) redux-thunk, redux-saga, redux-observable, redux-promise-middleware(프로미스 기반 미들웨어) 등..