A mini admin dashboard showcasing every SvelteKit remote function pattern.
Each card below calls a function that runs on the server — the client just calls it like a normal function.

query

Recent Orders

Load a list of data from the server

query(fn) wraps a server function. Call it in your template with await, and it returns cached data. Call .refresh() to re-fetch.

Order	Customer	Item	Total	Status
#1001	Alice Park	MacBook Pro 16"	$2499	shipped
#1002	Bob Chenssss	AirPods Max	$549	shipped
#1003	Carol Kim	iPad Air	$799	shipped
#1004	Dan Lee	Apple Watch Ultra	$799	shipped
#1005	Eve Zhang	Studio Display	$1599	shipped

query + schema

Order Lookup

Fetch a specific item by its ID

Add a schema as the first argument to validate inputs. The query re-runs automatically when the argument changes — no manual refresh needed.

Loading order #1001...

query.batch

Team Directory

4 calls → 1 server request

Each card calls getTeamMember(id) separately. Without batching, that's 4 network requests. With query.batch, SvelteKit automatically combines them into a single server call — solving the N+1 problem.

query.live

Live Visitors

Real-time data streamed from the server

Uses an async function* (generator) to push values to the client over a streaming connection. No polling, no manual refresh — data arrives automatically. Use .connected to check status.

form

Submit Support Ticket

Server-validated form with zero client boilerplate

Spread createTicket onto <form> and each field with .as('text'). Validation runs on the server with your schema. Errors show per-field via .issues(). Works without JavaScript too (progressive enhancement).

command

Ship an Order

Fire-and-forget server action

command() is for mutations — changing data on the server. Unlike query, commands are never cached. They run once and return. Click a button to mark an order as shipped.