SvelteKit CLAUDE.md Template

CLAUDE.md for SvelteKit applications

Category:templates
Type:template
Difficulty:beginner
Language:Markdown
javascript
typescript
beginner

Description

CLAUDE.md template for SvelteKit projects. Covers routing, load functions, form actions, server-side rendering, and Svelte-specific patterns for building modern web applications.

Content

Resource Content
# SvelteKit Project

## Overview
SvelteKit application with SSR and file-based routing.

## Tech Stack
- Framework: SvelteKit
- Language: TypeScript
- Styling: Tailwind CSS
- Database: Drizzle ORM

## Key Commands
```bash
npm run dev               # Dev server
npm run build             # Build
npm run preview           # Preview build
npm run check             # Svelte-check
npm run lint              # ESLint + Prettier
```

## Project Structure
```
src/
├── routes/               # File-based routing
│   ├── +page.svelte      # Page component
│   ├── +page.server.ts   # Server load
│   ├── +layout.svelte    # Layout
│   └── api/              # API routes
├── lib/
│   ├── components/       # Reusable components
│   ├── server/           # Server-only code
│   └── utils/            # Utilities
├── app.html              # HTML template
└── app.d.ts              # Type declarations
```

## Conventions
- Use `$lib` alias for imports
- Load data in `+page.server.ts`
- Form actions for mutations
- Use `$:` for reactive statements

## Important Notes
- Server code in `+page.server.ts`
- Use `$app/stores` for page data
- Hooks in `hooks.server.ts`