title: Using .map() with useEffect and Api
body: <p>I am trying to use the useEffect to grab some data from an API. I am succesful in grabbing the data but after I set my state and try to map through it I just get "Can't read map of undefined". I think the problem is that it's running my .map() code before it gets the response. i am just unsure of how to solve this</p>
  
  <p>This is the api response:</p>
  
  <pre><code>data: {count: 87, next: "https://swapi.co/api/people/?page=2", previous: null, results: Array(10)}
  </code></pre>
  
  <p>Here is my code</p>
  
  <pre><code>import React, { useState, useEffect } from 'react';
  import axios from 'axios';
  import './App.css';
  import CharacterMap from './characterMap'
  
  const App = () =&gt; {
    let [getChars, setChars] = useState(0);
    useEffect(() =&gt; {
      axios.get(`https://swapi.co/api/people/`)
        .then(res =&gt; setChars(res) )
    },[]);
   console.log(getChars.data.map((e) =&gt; e))
    return (
  
      &lt;div className="App"&gt;
        &lt;CharacterMap info={getChars} /&gt;
      &lt;/div&gt;
    );
  }
  export default App;
  </code></pre>