Multiple redux-sagas
<p>I use react-redux and redux-saga for API calls from <a href="http://www.webpackbin.com/NkNhb8R3-" rel="noreferrer">this</a> example. My target is to do another API calls with different urls and to use them in different pages. How to achieve that?</p>

<p><strong>Sagas:</strong></p>

<pre><code>import { take, put,call } from 'redux-saga/effects';
import { takeEvery, delay ,takeLatest} from 'redux-saga';
function fetchData() {
    return  fetch("https://api.github.com/repos/vmg/redcarpet/issues?state=closed")
    .then(res =&gt; res.json() )
    .then(data =&gt; ({ data }) )
    .catch(ex =&gt; {
        console.log('parsing failed', ex);
        return ({ ex });
    });
}
function* yourSaga(action) {
    const { data, ex } = yield call(fetchData);
    if (data)
    yield put({ type: 'REQUEST_DONE', data });
    else
    yield put({ type: 'REQUEST_FAILED', ex });
}
export default function* watchAsync() {
    yield* takeLatest('BLAH', yourSaga);
}
export default function* rootSaga() {
    yield [
        watchAsync()
    ]
}
</code></pre>

<p><strong>App:</strong></p>

<pre><code>import React, { Component } from 'react';
import { connect } from 'react-redux';
class App extends Component {
    componentWillMount() {
        this.props.dispatch({type: 'BLAH'});
    }
    render(){
       return (&lt;div&gt;
            {this.props.exception &amp;&amp; &lt;span&gt;exception: {this.props.exception}&lt;/span&gt;}
            Data: {this.props.data.map(e=&gt;&lt;div key={e.id}&gt;{e.url}&lt;/div&gt;)}

          &lt;/div&gt;);
    }
}
export default connect( state =&gt;({
    data:state.data , exception:state.exception
}))(App);
</code></pre>

<p>My target is to make another saga, which I will use in another component, and both to not mess with each other. Does that possible?</p>