Add your first server action

Your first server action turns page data from an idea into a contract

The moment you add a first Server Connect action, the page stops depending on imagined data and starts depending on a defined request and response. That is why this step matters in the beginner path: it gives the page a real backend boundary you can test, inspect, and reuse.

Real request

A page or form now calls something concrete.

Visible output

The action returns JSON you can inspect before binding.

Reusable logic

The same action can support multiple pages or workflows.

Define what data or operation the page actually needs.

Create the server action before you overcomplicate the page bindings.

Test the action output directly so the frontend has a trustworthy contract.

The practical beginner pattern is read or submit one clear thing

A strong first action is usually one of two patterns: fetch a readable dataset for a page, or accept a simple form submission. Both keep the data contract small enough to understand while teaching the same core lesson: inputs come in, server logic runs, JSON comes back.

TIP: If you cannot describe the response shape in one sentence yet, the first action is probably too ambitious for the beginner stage.

Start with a single read action or a single form action.

Use the action output to confirm the shape of the data before you bind it on the page.

Keep the first version small enough that you can explain every input and output.

Next steps

Use the practical tours below when you want the actual editor workflow, then return to the beginner sequence to preview the result.

Open a real Server Connect action example to see the editor flow.

Compare the action output with the page or form that will consume it.

Return to the beginner path once the backend handoff feels concrete.