리덕스 사가의 필요성

Question

export async function addToCart ( id ) { const body = { id }; const request = await Axios . post ( ` ${ USER_SERVER } /addToCart` , body ) . then ( response => response . data ); return { type : ADD_TO_CART , payload : request } } 안녕하세요 강사님! 위의 코드처럼 actions.js에서 서버와 통신을 하면 비동기 통신이 끝난다고 생각이 드는데요. 이 결과를 redux에 넘겨서 새로운 state를 반환하면 redux-saga나 redux-thunk가 필요없는 게 아닐까 하는 궁금증이 생겼습니다. 이런 방식이 saga를 쓰는 것에 비해 단점이 있어서 안 쓰는건지, 아니면 action객체는 비동기 통신을 해서는 안되서 saga를 사용하는 건지가 궁금합니다. 항상 가려운 부분을 시원히 긁어주셔서 감사합니다.

이재승 · Answer

안녕하세요 말씀하신대로 이 방식으로 API 응답값을 리덕스에 저장할 수 있습니다 다만 API 호출 status(isFetching 등)를 관리하기는 힘들어보입니다 API status 를 위한 별도 액션 생성자 함수를 만들 수도 있긴합니다 그렇게하면 사용하는 쪽에서 여러 액션을 호출해야되서 불편할 것 같네요 사용하는 쪽에서 편하게 하기 위해 utility 함수를 만들 수도 있습니다 그렇게 하다보면 결국 리덕스 사가가 지원해주는 여러 기능을 직접 구현해야 될거에요 제가 언급한 API status 관리 외에도 리덕스 사가는 많은 장점을 갖고 있습니다 (물론 단점도 있구요) 예를 들어, fetchProduct 라는 액션이 짧은 시간에 두 번 발생했을 때, 둘 다 처리할지 또는 하나는 무시하고 다른 하나만 처리할지를 리덕스 사가에서는 쉽게 구현할 수 있습니다 라이브러리를 비판적인 시각으로 보는 것은 개발 공부를 하는데 많은 도움이 되는 것 같아요 👍