Programming Tutorials

  You have likely encountered this error while refactoring an application to the Next.js App Router or attempting to pass an event handler from a parent Server Component to a child Client Component: Error:  Functions cannot be passed directly to Client Components unless they are explicitly exposed by "use server". This error acts as a hard stop during development. It highlights a fundamental misunderstanding of the network boundary introduced by React Server Components (RSC). The Root Cause: The Serialization Boundary To understand why this fails, you must understand how Next.js renders your application. Server-Side Rendering:  React renders the Server Components into a special format called the  RSC Payload . This is a JSON-like tree representing your UI. Network Transmission:  This payload is streamed to the browser. Hydration/Reconciliation:  The browser parses the payload and reconciles it with the DOM and Client Components. Because the data flows over ...