title: I am suppose to fetch data (name & email) from api. My program is compiled sucessfully but I'm getting errors in console. https://randomuser.me/api
body: <pre><code>import React, {useState, useEffect} from &quot;react&quot;;
  import './App.css';
  
  function App() {
  
    const [ data, setData ] = useState([]);
  
    useEffect(  ()=&gt; {
      loadData();
      //getData();
    }, []);
  
    const loadData = async () =&gt; {
      await fetch(&quot;https://randomuser.me/api&quot;)
      .then(response =&gt; response.json())
      .then(receiveddata =&gt; setData(receiveddata));
    }
  
    console.log(data);
  
    return (
      &lt;div className=&quot;App&quot;&gt;
        &lt;p&gt; Fetch/ Async/ Await&lt;/p&gt;
        {data.map(user =&gt; (
          &lt;div key={user.id}&gt;{user.name}, {user.email}&lt;/div&gt;
        ))}
      &lt;/div&gt;
    );
  }
  
  export default App;
  </code></pre>
  <p>I'm getting this error on the console,</p>
  <blockquote>
  <p>Uncaught TypeError: data.map is not a function</p>
  </blockquote>