title: Not able to connect React App with a NodeJS in Backend
body: <p>I am trying to fetch data from backend but getting error <code>fetchData.map is not a function</code>.
  <br>
  If can anyone explain me why <code>fetchData.map is not a function</code></p>
  <p><a href="https://codesandbox.io/s/admiring-feather-z5m3pw?file=/index.js" rel="nofollow noreferrer">This is my NodeJS</a><br>
  <a href="https://codesandbox.io/s/vigorous-haibt-04yu5r?file=/src/App.js" rel="nofollow noreferrer">This is my ReactJS</a></p>
  <p>This is react code</p>
  <pre><code>    function App() {
          const [fetchData, setFetchData] = useState([]);
          useEffect(() =&gt; {
              fetch(&quot;/api&quot;)
                  .then((res) =&gt; res.json())
                  .then((data) =&gt; {
                      console.log(data);
                      setFetchData(data);
                  });
          }, []);
          return &lt;&gt;{fetchData.map(data=&gt; &lt;div&gt;data&lt;/div&gt;)}&lt;/&gt;;
      }
  </code></pre>
  <p>This is NodeJS code</p>
  <pre><code>
      const express = require(&quot;express&quot;);
      const app = express();
      const test = require(&quot;./test.json&quot;);
      
      PORT = 3001;
      
      app.get(&quot;/api&quot;, (req, res) =&gt; {
          res.json(test);
      });
      
      app.listen(PORT, () =&gt; console.log(`Server Started on ${PORT}`));
  
  </code></pre>
  <p><a href="https://i.stack.imgur.com/YaZMA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/YaZMA.png" alt="enter image description here" /></a></p>