SvelteKit Full-Stack

Build full-stack web apps with SvelteKit and Svelte 5. Generates runes-based components, form actions, server-side load functions, API routes, and adapter configurations for edge deployment.

This skill covers SvelteKit with Svelte 5's runes system for modern full-stack development. It generates components with $state, $derived, and $effect runes, server-side load functions with proper typing, form actions with progressive enhancement, API routes with +server.ts, parameterized routes, layout groups, error boundaries, and adapter configs for Vercel, Cloudflare, and Node. Covers Superforms for complex form handling and Lucia for authentication.

When to use

Use when building full-stack apps with SvelteKit, writing Svelte 5 components with runes, implementing server-side rendering, or creating form-heavy applications.

Examples

Dashboard app

Build an admin dashboard with SvelteKit

Create a SvelteKit admin dashboard with protected routes using Lucia auth, data tables with server-side pagination, chart components with Svelte 5 runes, and dark mode toggle

Form actions

Implement complex form handling

Build a multi-step registration form in SvelteKit using form actions with Superforms, Zod validation, file upload with preview, and progressive enhancement that works without JS