8 articles tagged #layout on hackpile.dev.
- Page Data vs Layout Data
Learn how SvelteKit separates page and layout data loading, how data flows through layouts, and how to access it from any component.
- +layout.js
Learn universal data loading for layouts in SvelteKit with +layout.js. Load shared data that's available to all child pages and layouts.
- +layout.svelte
Learn how +layout.svelte wraps pages with shared UI in SvelteKit. Master layout nesting, the children snippet, and building consistent application structure.
- The Problem: Repeating Code
See why copying navigation to every page creates maintenance nightmares — and why layouts exist.
- Understanding {@render children()}
Learn exactly how page content flows into layouts through the children snippet.
- Add a Site Header
Build BookIt's navigation header in the layout so it appears on every page.
- Add a Site Footer
Complete the layout with a footer that appears on every page.
- Nested Layouts
Create a services-specific layout that adds sub-navigation while keeping the main site layout.