How do I fetch data from an API in Next.js?

How do I fetch data from an API in Next.js?

In Next.js, you can fetch data using the getStaticProps or getServerSideProps functions. Which one would you like to know more about?

What's the difference between getStaticProps and getServerSideProps?

getStaticProps is used for static generation at build time, while getServerSideProps fetches data on each request. Do you have a specific use case in mind?

I want to display user data that updates frequently. Which method should I use?

For frequently updating data, getServerSideProps is the better choice as it fetches the latest data on each request.

Can you show me a code example of using getServerSideProps?

Sure! Here's a simple example:

export async function getServerSideProps() {
  const res = await fetch('https://api.example.com/users');
  const data = await res.json();
  return { props: { users: data } };
}

This will fetch user data on each request.