(Frontend Issue) Unhandled Runtime Error TypeError: Failed to fetch on React and Next JS

[rayyanekaputra]

in the documentation it is written that is only need to use await without async but it is giving me syntax error, now i put async statement beforehand and suddenly it didnt fetch anything.

const response = async() => await getJson({
engine: "google_scholar_author",
author_id: ZZZ,
api_key: XXX // Get your API_KEY from https://serpapi.com/manage-api-key
});
console.log(response);

i have used the single callback version (without using fetch/async/await) it works but it cant be logged to the browser.. only on my vscode terminal meaning it only works serverside on node js. how am i suppose to pass this to the browser?

getJson(
{
engine: "google_scholar_author",
author_id: ZZZ,
api_key:
XXX,
},
(json) => {
json["articles"].forEach((article) => {
console.log(article.title);
setData((prev) =>[...prev, article.title]);
});
}
);

console.log(data)