Svelte is an open source frontend UI component framework for building reactive, lightweight, and modern w1eb applications.
- Svelte is for building highly reactive UIs for the Webbrowser.
- The word svelte means "gracefully slender in figure" and hints at the lightweight nature of a typical Svelte-app.
- Small in size and thus excutes fast
- Svelte is a compiler and not a framework. This means that you don't ship a framework plus your code but a javascript version of your compiled app.
- During a build your Svelte code is transpiled into efficient runtime plain JavaScript code that will then run directly in the browser.
- Building a Svelte app you use specific syntax that is understood by the Svelte transpiler.
- Svelte depends on Node.js during design-time
Sveltekit npx sv create <appname>
Svelte - npm create vite@latest <appname>
Learning Resources
- Build Apps with Svelte
- Coding Cat Podcast
- Learn Svelte in 23 Hours
- Smilga- Svelte Tutorial and Projects Course
- Getting Started with SvelteKit
- Svelte Radio Podcast
- What's the deal with SvelteKit?
- MDN Getting Started Series
- Build A Blog App with ExpressJs and SvelteJs
- Building a Full Stack Application From Scratch
- Scrimba Course
- Svelte.js - The Complete Guide
- Svelte Master YouTube Channel
- Svelte Steps - A customizable step component written in Svelte
- Svelte 3 with Rich Harris on egghead.io
- Want to Learn Svelte? Here's a Free 16-Part Course by Noah Kaufman
Tools
- SvelteStorm - A Svelte IDE like no other
- Plenti - static site generator
- JungleJS - JAMStack framework for Svelte
- Svelte NodeGUI Build performant, native, cross-platform desktop apps with Svelte
UI Libraries
- Attractions
- BlackCatUI The UI toolkit for Svelte and Tailwind
- Bulma Components for Svelte
- proi-ui
- Flowbite Svelte Flowbite component library for Svelte
- Melt
- Smelte
- Skeleton the UI toolkit for Svelte and Tailwind
- Svelte Atoms UI library for svelte, based on Atol design
- Svelte Carbon Components
- Svelte FlatUI Components
- Svelte Material UI
- SvelteChota - UI component library for Svelte built with tiny chota.css
- SvelteStrap
Generic Components and Libraries
- Svelte Apollo
- Date Picker Svelte
- Elder.js - SEO focused, Svelte Framework & Static Site Generator
- Felte An extensible form library for Svelte, Solid and React
- mdsvex Svelte Markdown component
- Routify - Routes for Svelte, automated by your file structure.
- Svelte Autocomplete
- Svelte Awesome Icons
- svelte-calendar
- Svelte Color Picker Component
- svelte-drag - A lightweight Svelte Action to make your elements draggable.
- svelte-feather-icons
- SvelteFire - Cybernetically enhanced Firebase apps
- Svelte Formula - Zero Configuration Reactive Forms for Svelte
- svelte-spa-router
- Svelte Toast Repo and Demo
- Svelte UI
- Svelvet - Mapping out your ideas with Svelte has never been easier
- Threlte - Rapidly build interactive 3D apps for the web.