title: Display all characters from API across multiple pages in REACT
body: <p>I'm a total beginner in programming and I'm trying to build a react app displaying all Rick and Morty characters using this API:</p>
  <p><a href="https://rickandmortyapi.com/api/character?page=$%7Bpages%7D" rel="nofollow noreferrer">https://rickandmortyapi.com/api/character?page=${pages}</a></p>
  <p>Using fetch, I was only able to get the first 20 characters. This is my code:</p>
  <pre><code>    fetch(&quot;https://rickandmortyapi.com/api/character&quot;)
        .then((res) =&gt; res.json())
        .then((data) =&gt; setCharacters(data.results));
    }, []);
  </code></pre>
  <p>I tried using axios but it won't show up in my package.json.</p>
  <p>I would also really like to make functions mapping over the characters and building buttons that filter them by species and gender.</p>
  <pre><code>const [characters, setCharacters] = useState([]);
    return (
      &lt;div&gt;
        {character.filter(character =&gt; character.gender = &quot;Male&quot;).map(filteredCharacter =&gt; (
          &lt;li&gt;
            {filteredCharacter.gender}
          &lt;/li&gt;
        ))}
      &lt;/div&gt;
    );
  }
  
  export default App;
  </code></pre>
  <p>I'm getting a ton of errors. Help me?</p>