Ask Claude to Scaffold a SvelteKit App
Setting up SvelteKit from scratch means making a lot of upfront decisions — file-based routing, layout hierarchies, server-side load functions. Let Claude handle the boilerplate so you can focus on building.
Set up a SvelteKit project for a blog application. Include:
- A root layout with navigation
- A /blog route with a +page.server.ts that fetches posts from a mock API
- A /blog/[slug] dynamic route with proper load functions
- A /about static page
- TypeScript throughout
Claude will scaffold the full directory structure with +page.svelte, +layout.svelte, and +page.server.ts files that follow SvelteKit conventions. It understands the difference between universal and server-only load functions, and will type your PageData correctly.
You can follow up with prompts like "add form actions to the contact page" or "convert the data loading to use SvelteKit's streaming responses" once the skeleton is in place.
This is especially useful when you're learning SvelteKit, because Claude will explain the why behind each file if you ask — turning scaffolding into a tutorial rather than just code generation.
Follow up: Add a +error.svelte page and a hooks.server.ts file
that authenticates requests using a session cookie.
Describe what you want to build, not how to build it — Claude knows SvelteKit's conventions well enough to handle the rest.
Log in to leave a comment.
The /security-review command scans your uncommitted changes for injection vectors, auth gaps, hardcoded secrets, and other common vulnerabilities.
The SessionStart hook fires when any session begins or resumes, making it ideal for loading environment variables and running one-time setup scripts.
Ask Claude to write property-based tests for your functions using fast-check — it identifies the mathematical invariants in your code and generates tests that cover inputs you'd never enumerate by hand.