how to fix “Objects are not valid as a React child (found: [object Promise]). If you meant to render a collection of children, use an array instead.” [duplicate]

1 In Next.js, I created a component that fetch data from Github, then I faced this error. Anybody knows this reason and how to fix this?? On my understanding, this error has happened because type of “data” is object and perhaps “promise”, but I am not sure how could I fix this then. I replaced “data” to “{data.login}”, but it didn’t work and nothing changed.

2 The result of console.log itself has successfully achieved but this result was shown 5 times but don’t know why…

const GetGithubData = async () => {
  // For owner and repo, enter the GitHub username and repository name you want to retrieve.
  const owner = "aaaa"; // dummy
  const repo = "bbbb"; // dummy

  const url = `https://api.github.com/repos/${owner}/${repo}/contributors`;
  const res = await fetch(url);
  const data = await res.json();

  return console.log(data);
};

export default GetGithubData;