fetch request is giving successful response but the data doesn't get fetched

Question

I am trying to make a fetch request to localhost:8000/api/cars and when I logged the response.json() it was giving me 200 ok as response but the cars didn't get fetched when I tried to use the response in that syntax:

   function getRacers() {
    // GET request to `${SERVER}/api/cars`
  return fetch(`${SERVER}/api/cars`)
    .then(response => {
        // handle the response
        response.json()
    console.log(response.json)
    })
    .catch(error => {
        // handle the error
        console.log(error)
    }); 
}

and then I called getRacers

getRacers()
        .then((racers) => {
            const html = renderRacerCars(racers)
            renderAt('#racers', html)
        })

and then I got the error after I tried to use racers in renderRacerCars():

function renderRacerCars(racers) { if (!racers.length) { return <h4>Loading Racers...</4> }

I got error that racers is undefined and so we can't get its length, the error is:

Uncaught (in promise) TypeError: Cannot read property 'length' of undefined at renderRacerCars (index.js:176) at index.js:26