title: Fetch data with redux saga
body: <p>I have created an example for fetching data from API where I used <code>redux-thunk</code>. The following code is working.</p>
  
  <p>In this context, I want to rewrite my code but using <code>redux saga</code>.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import React from 'react';
  import {createStore, applyMiddleware} from 'redux';
  import ReactDOM from "react-dom";
  import thunk from 'redux-thunk';
  import axios from 'axios';
  
  function App(props) {
    const initialState = {
      loading: false,
      data: [],
      error: ''
    };
    const reducer = function (state = initialState, action) {
      switch (action.type) {
        case 'START_FETCH':
          return {
            ...state,
            loading: true
          };
        case 'PROCESS_FETCH':
          return {
            ...state,
            loading: false,
            data: action.payload,
            error: ""
          };
        case 'END_FETCH':
          return {
            ...state,
            loading: false,
            data: [],
            error: action.payload
          }
      }
      
      return state;
    };
    const START_FETCH = 'START_FETCH';
    const PROCESS_FETCH = 'PROCESS_FETCH';
    const END_FETCH = 'END_FETCH';
    let startFetchFun = () =&gt; {
      return {
        type: START_FETCH,
        loading: true
      }
    };
    
    let processFetchFun = (users) =&gt; {
      return {
        type: PROCESS_FETCH,
        payload: users
      }
    };
    
    let endFetchFun = (error) =&gt; {
      return {
        type: PROCESS_FETCH,
        payload: error
      }
    };
    
    let fetchUsersWithThunk = () =&gt; {
      return function (dispatch) {
        dispatch(startFetchFun());
        axios.get('https://jsonplaceholder.typicode.com/users')
            .then((response) =&gt; {
              dispatch(processFetchFun(response.data));
            })
            .catch((error) =&gt; {
              dispatch(endFetchFun(error.message));
              console.log(error.message);
            })
      }
    };
    
    const store = createStore(reducer, applyMiddleware(thunk));
    store.subscribe(() =&gt; {
      console.log(store.getState())
    });
    store.dispatch(fetchUsersWithThunk());
    
    
    return (
        &lt;div className="main"&gt;
          &lt;h1&gt;Redux-Thunk&lt;/h1&gt;
        &lt;/div&gt;
    );
  }
  
  ReactDOM.render(
      &lt;App/&gt;, document.getElementById('root'));</code></pre>
  </div>
  </div>
  </p>
  
  <p>I want to write the code above using redux saga, to understand better sagas. So, how to use redux-saga for this example? Who will be able to help me?</p>