Svelte by Example
Svelte is a frontend framework & compiler
to generate minimal, optimized JavaScript code for web applications.
SvelteKit is a meta-framework to build full-stack
web applications with Svelte.
Svelte by Example is a succinct, gentle introduction to Svelte & SvelteKit to pique your curiosity. If you want to dive deeper, we recommend reading through the Svelte tutorial & docs.
- Hello World
- Data
- Components & Props
- Loops & Conditionals
- Events
- State
- Derived State & Effects
- More Reactivity
- Async UI
- Debugging
- Styling
- Styles & CSS
- CSS Custom Properties
- Class & Style Directives
- Advanced
- Lifecycle Functions
- Snippets
- Context
- Actions
- Special Elements
- Error Boundaries
- Modules
- Reactive Built-ins
- TypeScript
- Stores
- Writable Stores
- Custom Stores
- Derived Stores
- Readable Stores
- Animation
- Motion
- Transition
- Animate
- SvelteKit
- Filesystem & Routing
- Pages & Links
- Page Scripts
- Server Scripts
- Layouts
- Form Actions
- API Endpoints
- URL & Navigation State
- Refreshing Data
- Errors & Redirects
- Environment Variables & Secrets
- Hooks & Locals
- Cookies & Sessions