xeunnie

Redux Middleware 톺아보기! 🦸‍♂️🦸‍♀️Redux를 사용하다 보면, 단순히 상태를 관리하는 걸 넘어 더 복잡한 작업을 처리해야 할 때가 있어요. 예를 들어, 비동기 API 호출이나 로그 출력 같은 일을 말이죠. 바로 여기서 Redux Middleware가 등장합니다. Middleware는 마치 액션과 리듀서 사이에서 일을 처리하는 비밀 요원 같아요. 오늘은 이 요원을 제대로 이해하고, 실무에서도 유용하게 사용할 수 있도록 팍팍 알려드릴게요. 😊🔍 Middleware란 무엇일까?Redux에서 Middleware는 액션이 리듀서에 도달하기 전에 중간에서 가로채고 추가 작업을 수행하는 도구입니다. 쉽게 말해:액션이 디스패치(dispatch)되면,Middleware가 그 액션을 가로채,뭔..

Redux Saga 톺아보기! 🧙‍♂️Redux Saga는 Redux에서 비동기 작업을 깔끔하고 우아하게 처리하기 위한 미들웨어예요. 이름부터 뭔가 스케일이 커 보이지 않나요? “사가(Saga)“는 연대기라는 뜻인데, 비동기 작업을 이야기처럼 잘 짜여진 흐름으로 관리하겠다! 라는 포부를 담고 있습니다. 오늘은 Redux Saga가 왜 필요한지, 어떻게 사용하는지, 그리고 어떤 매력이 있는지 다뤄볼게요. 🌟⛲️ Redux Saga는 왜 필요한가요?우리가 웹 애플리케이션을 개발하다 보면 이런 상황과 마주하게 돼요:데이터를 가져오기 위해 API 호출을 해야 한다.호출 중에 로딩 상태를 보여주고, 에러가 나면 메시지도 띄워야 한다.요청이 끝나면 성공 여부에 따라 다른 작업을 처리해야 한다.비동기 작업을 처리..

Redux Thunk 톺아보기! 🍲Redux Thunk는 Redux에서 비동기 작업을 처리할 수 있게 해주는 미들웨어입니다. “Thunk”라는 이름은 다소 신비롭게 들릴 수 있지만, 간단히 말해 액션을 리턴하는 함수를 디스패치할 수 있게 만들어주는 도구라고 생각하면 돼요. 이 글에서는 Redux Thunk가 왜 필요한지, 어떻게 작동하는지, 그리고 어떻게 활용할 수 있는지 다룰게요. 준비되셨나요? 출발~! 🚀🔍 Redux에서 비동기 작업이 왜 필요한가?Redux는 순수한 상태 관리 라이브러리로, 단방향 데이터 흐름을 유지하는 것을 목표로 합니다.즉, 액션(Action)이 발생하면 리듀서(Reducer)가 새로운 상태를 반환하고, 상태가 변경되면 UI가 업데이트되죠. 하지만… 여기서 문제가 하나 있어..