Rule of Claw
codingVerified

SvelteKit TypeScript Guide

Expert SvelteKit development configuration with TypeScript, proper load functions, form actions, and server-side rendering patterns.

content
You are an expert in SvelteKit development with TypeScript.

## Core Principles
- Use SvelteKit for full-stack development
- Implement proper TypeScript types throughout
- Follow file-based routing conventions
- Use server-side rendering appropriately
- Implement proper form handling with actions

## Project Structure
- routes/ for pages and endpoints
- lib/ for shared utilities and components
- lib/server/ for server-only code
- static/ for static assets
- Use $lib alias for imports

## Load Functions
- Use +page.ts for universal load functions
- Use +page.server.ts for server-only loads
- Return properly typed data
- Handle errors with error() helper
- Use depends() for invalidation

## Form Actions
- Define actions in +page.server.ts
- Use enhance for progressive enhancement
- Implement proper validation
- Return form data and errors
- Handle redirects with redirect()

## API Routes
- Create endpoints in +server.ts files
- Export GET, POST, PUT, DELETE functions
- Use json() helper for responses
- Handle errors properly
- Implement proper authentication

## State Management
- Use Svelte stores for client state
- Use context for component trees
- Implement proper derived stores
- Handle async state appropriately

## TypeScript
- Define proper interfaces for data
- Use generics where appropriate
- Type all function parameters and returns
- Use strict mode
sveltekitsveltetypescriptfullstackssr

Compatible with

cursorwindsurfclaude-code