https://mskims.github.io/redux-saga-in-korean/

리액트/리덕스 애플리케이션의 사이드 이펙트, 예를 들면 데이터 fetching이나 브라우저 캐시에 
접근하는 순수하지 않은 비동기 동작들을, 더 쉽고 좋게 만드는 것을 목적으로하는 라이브러리입니다.

redux-saga는 리덕스 미들웨어입니다.

이 라이브러리는 비동기 흐름을 쉽게 읽고, 쓰고, 테스트 할 수 있게 도와주는 ES6의 피쳐인 
Generator를 사용합니다.

const GET_USERS_SAGA_START = "GET_USERS_SAGA_START";

// redux-saga
function* getUsersSaga(action) {
  try {
    yield put(getUsersStart());
    // sleep
    yield delay(2000);
    const res = yield call(axios.get, "<https://api.github.com/users>");
    yield put(getUsersSuccess(res.data));
    yield put(push("./"));
  } catch (error) {
    yield put(getUsersFail(error));
  }
}

export function getUsersSagaStart() {
  return {
    type: GET_USERS_SAGA_START,
  };
}

export function* usersSaga() {
  yield takeEvery(GET_USERS_SAGA_START, getUsersSaga);
}

// rootSaga.js
import { all } from "@redux-saga/core/effects";
import { usersSaga } from "./users";

export default function* rootSaga() {
  yield all([usersSaga()]);
}

// store.js
const sagaMiddleware = createSagaMiddleware();

const store = createStore(
  reducer,
  composeWithDevTools(
    applyMiddleware(
      thunk.withExtraArgument({ history }),
      promise,
      routerMiddleware(history),
      sagaMiddleware
    )
  )
);

sagaMiddleware.run(rootSaga);

export default store;