title: Infinite console logging in React.js component
body: <p>I'm working on my MERN app, and when I'm logging smth in NewsPage component, it logs infinitely.</p>
  
  <p>NewsPage component:</p>
  
  <pre><code>const NewsPage = ({news, fetchNews}) =&gt; {
    const postNews = (title, body) =&gt; {
      axios.post("http://localhost:9000/news", { title, body });
    }
  
    useEffect(() =&gt; {
      fetchNews();
  
    }, [fetchNews, postNews])
  
    return (
      &lt;&gt;
        &lt;AddNewsForm postNews={postNews}/&gt;
        &lt;h1&gt;News:&lt;/h1&gt;
        &lt;NewsItemPage news={news} /&gt;
      &lt;/&gt;
    );
  };
  
  const mapStateToProps = state =&gt; ({
    news: state.news
  })
  
  export default connect(mapStateToProps, {fetchNews})(NewsPage);
  </code></pre>
  
  <p>Fetch news action:</p>
  
  <pre><code>export const fetchNews = () =&gt; dispatch =&gt; {
    fetchRequest();
  
    try {
      const fetch = async () =&gt; {
        const res = await axios.get("http://localhost:9000/news");
  
        dispatch({
          type: a.FETCH_NEWS_SUCCESS,
          payload: res.data
        });
      }
      fetch()
    } catch (e) {
      dispatch({
        type: a.FETCH_NEWS_FAILURE,
        error: e
      });
    }
  }
  </code></pre>
  
  <p>It works correctly, I can fetch news from and post news to my backend, but if I log anything in console, it would be logging infinitely, and I will not get any error.</p>
  
  <p>is there a way to fix this, and is this a real problem?</p>