sveltekit
Build full-stack web applications with SvelteKit — file-based routing, SSR, SSG, API routes, and form actions in one framework.
npx skills add sickn33/agentic-awesome-skills --skill sveltekit --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# SvelteKit Full-Stack Development ## Overview SvelteKit is the official full-stack framework built on top of Svelte. It provides file-based routing, server-side rendering (SSR), static site generation (SSG), API routes, and progressive form actions — all with Svelte's compile-time reactivity model that ships zero runtime overhead to the browser. Use this skill when building fast, modern web apps where both DX and performance matter. ## When to Use This Skill - Use when building a new full-stack web application with Svelte - Use when you need SSR or SSG with fine-grained control per route - Use when migrating a SPA to a framework with server capabilities - Use when working on a project that needs file-based routing and collocated API endpoints - Use when the user asks about `+page.svelte`, `+layout.svelte`, `load` functions, or form actions ## How It Works ### Step 1: Project Setup ```bash npm create svelte@latest my-app cd my-app npm install npm run dev ``` Choose **Skeleton project** + **TypeScript** + **ESLint/Prettier** when prompted. Directory structure after scaffolding: ``` src/ routes/ +page.svelte ← Root page component +layout.svelte ← Root layout (wraps all pages) +error.
- Overview
- When to Use This Skill
- How It Works
- Step 1: Project Setup
- Step 2: File-Based Routing
- Step 3: Loading Data with load Functions
- Step 4: API Routes (Server Endpoints)
- Step 5: Form Actions
- Step 6: Layouts and Nested Routes
- Step 7: Rendering Modes
- Examples
- Example 1: Protected Dashboard Route
- Example 2: Hooks — Session Middleware
- Example 3: Preloading and Invalidation
npm create svelte@latest my-app cd my-app npm install npm run dev
What does the sveltekit skill do?
Build full-stack web applications with SvelteKit — file-based routing, SSR, SSG, API routes, and form actions in one framework.
How do I install it?
Run `npx skills add sickn33/agentic-awesome-skills --skill sveltekit --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From sickn33/agentic-awesome-skills, a repository with 44,414 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.