in my frontend if i try to fetch from my backend by doing:

const response = await fetch(`/api/user/${id}`);

Nothing works and it says "/api" doesnt exist, however if i hardcode the localhost:3000 like this:

const response = await fetch(`http://localhost:3000/api/user/${id}`);

Everything works fine.

How can i avoid hardcoding the entire api url to my nextjs backend api?