Understanding the four different data-fetching methods in Next.js can initially feel overwhelming.
CSR (Client-Side Rendering) fetches data from an API after the page loads, typically using useEffect on every render.
SSR (Server-Side Rendering), on the other hand, retrieves data on every request, generating the page before it is sent to the user, which can cause a delay.
SSG (Static Site Generation) fetches data only once during build time, so the page remains static and does not fetch data on each request.
ISR (Incremental Static Regeneration) is a combination of SSR and SSG. Under certain conditions, the page is rebuilt and fetches data from the API again.
This is not a data-fetching method but a way to trigger a page rebuild for SSR or SSG based on specific events.