sveltekit-structure

What problem does it solve?

Structuring a SvelteKit application effectively, including routing, nested layouts, error handling, and understanding Server-Side Rendering (SSR) and hydration, can be challenging for new and experienced developers alike. This Skill provides clear, actionable guidance on best practices, helping you build scalable and maintainable applications.

Core Features & Use Cases

• Routing & File Naming: Master SvelteKit's file-system-based routing, including +page.svelte, +layout.svelte, +server.ts, and dynamic parameters, to create intuitive URLs.
• Layout Patterns: Implement nested layouts and use route groups (group) to organize application sections and apply different UI structures or authentication boundaries.
• Robust Error Handling: Understand how to place and utilize +error.svelte files to create effective error boundaries and handle various HTTP status codes gracefully.
• Use Case: When you're setting up a new SvelteKit project, refactoring an existing one, or troubleshooting routing and layout issues, this Skill helps you apply the correct structural patterns for scalability and maintainability.

Quick Start

Show me how to create a nested layout structure in SvelteKit where a root layout applies to all pages, and a dashboard-specific layout applies only to routes under /dashboard.