Trying to bind Laravel api to Reactjs

I made shit api on laravel and would like to bind to React, I have experience of binding with django, there for this I downloaded django-cors-headers, after adding a couple of settings and the error associated with fetch disappeared, if that I'm a noob in Laravel. i added .htaccess with this code:

RewriteEngine On
RewriteRule (.*) public/$1

But it's doesn't work

In react I wrote:

import React, { useEffect, useState } from 'react'

function ListCharacters() {
  let [characters, setCharacters] = useState([]);

useEffect (() => {
  getCharacter();
}, []);

let getCharacter = async () => {
  let response = await fetch('http://127.0.0.1:8000/api')
  let data = await response.json();
  console.log(data);
  setCharacters(data);
} 

return (
<div className='home'>
    
    <div className="characters">
      <h2>Posts</h2>
      { (characters.length > 0) ?(
        <div className="characters__item">
          {characters.forEach(element => {
            <div className="character">

            </div>
          })}
        </div>
        ) : (
        <h3>Posts Not Found</h3>
        )}
    </div>
    
    <div className="characters__filter">
      <h2>Filters</h2>
    </div>

</div>
)
}

export default ListCharacters

I also deduced from django

In api.php i wrote

Route::get('/', function() {
$characters = Character::all();
if (count($characters) !=0 ) {
    return response()->json(
        $characters
    );
} else {
    return response()->json([
        'nothing' => 'Characters not found'
    ]);
}
});

I didn't write controllers