'use client' lets you mark what code runs on the client. Add 'use client' at the top of a file to mark the module and its transitive dependencies as client code.
When a file marked with 'use client' is imported from a Server Component, compatible bundlers will treat the module import as a boundary between server-run and client-run code.
'use client' must be at the very beginning of a file, above any imports or other code
'use client' introduces a server-client boundary in the module dependency tree, effectively creating a subtree of Client modules.
'use server' marks server-side functions that can be called from client-side code.
Add 'use server' at the top of an async function body to mark the function as callable by the client. We call these functions Server Functions.
Instead of individually marking functions with 'use server', you can add the directive to the top of a file to mark all exports within that file as Server Functions that can be used anywhere, including imported in client code.
'use server' can only be used in server-side files. The resulting Server Functions can be passed to Client Components through props.
When calling a Server Function on the client, it will make a network request to the server that includes a serialized copy of any arguments passed. If the Server Function returns a value, that value will be serialized and returned to the client.