src 디렉터리에 modules 디렉터리를 만들고, 다음 파일을 작성해 보세요.

    modules/users.js

    import axios from 'axios';
    
    const GET_USERS_PENDING = 'users/GET_USERS_PENDING';
    const GET_USERS_SUCCESS = 'users/GET_USERS_SUCCESS';
    const GET_USERS_FAILURE = 'users/GET_USERS_FAILURE';
    
    const getUsersPending = () => ({ type: GET_USERS_PENDING });
    const getUsersSuccess = payload => ({ type: GET_USERS_SUCCESS, payload });
    const getUsersFailure = payload => ({
      type: GET_USERS_FAILURE,
      error: true,
      payload
    });
    
    export const getUsers = () => async dispatch => {
      try {
        dispatch(getUsersPending());
        const response = await axios.get(
          'https://jsonplaceholder.typicode.com/users'
        );
        dispatch(getUsersSuccess(response));
      } catch (e) {
        dispatch(getUsersFailure(e));
        throw e;
      }
    };
    
    const initialState = {
      users: null,
      user: null,
      loading: {
        users: false,
        user: false
      },
      error: {
        users: null,
        user: null
      }
    };
    
    function users(state = initialState, action) {
      switch (action.type) {
        case GET_USERS_PENDING:
          return { ...state, loading: { ...state.loading, users: true } };
        case GET_USERS_SUCCESS:
          return {
            ...state,
            loading: { ...state.loading, users: false },
            users: action.payload.data
          };
        case GET_USERS_FAILURE:
          return {
            ...state,
            loading: { ...state.loading, users: false },
            error: { ...state.error, users: action.payload }
          };
        default:
          return state;
      }
    }
    
    export default users;

    신간 소식 구독하기
    뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.