sveltekit-remote-functions

spences10's avatarfrom spences10

SvelteKit remote functions guidance. Use for command(), query(), form() patterns in .remote.ts files.

⭐0stars🔀0forks📁View on GitHub🕐Updated Dec 24, 2025
[Code Generation]

When & Why to Use This Skill

This Claude skill provides expert guidance for implementing SvelteKit remote functions, focusing on command(), query(), and form() patterns within .remote.ts files. It enables developers to build type-safe, server-side logic with integrated schema validation and seamless client-server communication, optimizing the development workflow for modern SvelteKit applications.

Use Cases

  • Implementing one-time server actions, such as deleting records or triggering processes, using the command() pattern with built-in validation.
  • Setting up reactive data fetching with the query() pattern to handle repeated reads and flicker-free UI updates in Svelte components.
  • Developing robust form submission logic using the form() pattern, ensuring server-side schema validation via Valibot or Zod.
  • Managing secure server-side operations by accessing cookies and headers through getRequestEvent() within remote function files.
  • Optimizing frontend performance using <svelte:boundary> and asynchronous data loading patterns recommended for remote functions.
namesveltekit-remote-functions
# IMPORTANTKeep description on ONE line for Claude Code compatibility
descriptionSvelteKit remote functions guidance. Use for command(), query(), form() patterns in .remote.ts files.

SvelteKit Remote Functions

Quick Start

File naming: *.remote.ts for remote function files

Which function? One-time action → command() | Repeated reads → query() | Forms → form()

Example

// actions.remote.ts
import { command } from "$app/server";
import * as v from "valibot";

export const delete_user = command(
  v.object({ id: v.string() }),
  async ({ id }) => {
    await db.users.delete(id);
    return { success: true };
  }
);

// Call from client: await delete_user({ id: '123' });

Reference Files

Notes

  • Remote functions execute on server when called from browser
  • Args/returns must be JSON-serializable
  • Schema validation via StandardSchemaV1 (Valibot/Zod)
  • getRequestEvent() available for cookies/headers access
  • In components: Use <svelte:boundary> + {@const await} (no flicker)
  • Refresh queries: Call query().refresh() - updates without flicker
  • Last verified: 2025-12-24