What is server side rendering in React, and why is Next.js commonly used for it?

Server side rendering means generating the full HTML for a page on the server before sending it to the browser, instead of sending an almost empty page and building everything with JavaScript afterward. This helps pages appear faster and makes them easier for search engines to read. Next.js is a popular framework that makes setting up server side rendering in React simple.

// app/page.js in Next.js, this page is server rendered by default
export default async function HomePage() {
  const posts = await fetchPosts();
  return <PostList posts={posts} />;
}