리덕스 로깅 미들웨어 및 비동기 Redux Thunk

로깅, 충돌보고, 비동기 API 와 통신, 라우팅 등등

비동기 API를 위한 미들웨어

'일부 지연된 작업을 수행하는 코드 조각'

지금 당장 논리를 실행하는 대신 나중에 작업을 수행하는데 사용할 수 있는 함수

thunk 없이 사용해도 괜찮지만 미들웨어는 중앙 집중식 접근 방식이므로 구성요소를 더 간단하고 일반화하고

한곳에서 데이터 흐름을 제어 할 수 있어 큰 앱에서 리덕스를 사용하기 더 편해진다.

비동기 작업 관리: Thunk는 Redux에서 비동기 작업을 관리하기에 좋은 방법이다.

Redux는 동기 작업을 다루는 데는 효과적이지만 비동기 작업은 Thunk를 사용하여 쉽게 처리할 수 있다.

Thunk를 사용하면 작업을 순서대로 실행하거나 여러 작업을 동시에 처리하는 등 다양한 비동기 시나리오를 다루기 쉽다.

액션 생성자의 확장성: Thunk를 사용하면 액션 생성자를 확장할 수 있다.

예를 들어, 특정 액션이 실행되기 전에 로그인 상태를 확인하거나, 데이터를 캐싱하거나, 오류 처리를 추가하는 등의 작업을 할 수 있다.

비동기 작업의 중앙 관리: Thunk를 사용하면 비동기 작업을 중앙에서 관리하므로 코드가 더 깨끗하고 유지보수가 쉽다.

Axios를 직접 호출하면 여러 곳에서 비슷한 코드를 반복해서 사용해야 하므로 중복 코드와 오류 가능성이 높아진다.

테스트 용이성: Thunk를 사용하면 비동기 작업을 모듈화하고 테스트하기 쉽다.

Jest 또는 다른 테스트 프레임워크를 사용하여 Thunk 함수를 테스트하고 모의 객체(Mock)를 사용하여 API 호출을 시뮬레이션.

미들웨어 확장성: Redux 미들웨어는 Thunk 외에도 다양한 미들웨어를 사용할 수 있다.

Thunk를 사용하면 다른 미들웨어와 함께 사용하기 쉬우며, 필요한 경우 미들웨어를 추가하여 애플리케이션의 기능을 확장할 수 있다.

요약하면, Thunk를 사용하면 Redux 애플리케이션에서 비동기 작업을 효과적으로 관리하고 제어할 수 있으며,

코드의 가독성과 유지보수성을 향상시킬 수 있어, Axios를 직접 사용하는 것보다 더 많은 혜택을 제공한다.

Thunk 없이 Axios사용 예시

또한 원래 Actions는 객체여야 하는데 현재 함수를 Dispatch 하고 있어서 에러가 난다.

그래서 함수를 dipatch할 수 있게 해주는 redux-Thunk 미들웨어를 설치해야한다.