Wolfr/svelte-resources.md

## svelte-resources.md

      
    Raw
  

              svelte-resources.md
            
          
    Svelte Resource List

Resources that go beyond the official documentation. To learn Svelte or to find things to use in your own projects. If you have nice resources to add, please comment below.
Official resources


Main tutorial https://svelte.dev/tutorial/basics
API https://svelte.dev/docs
Main repo: https://github.com/sveltejs/svelte

Templates


Start a new project from a template

https://github.com/sveltejs/template


Component template

https://github.com/sveltejs/component-template


Talks/presentations

Learn the concepts behind Svelte. Best resources to get excited about Svelte!
Talks by Rich Harris, main author of Svelte


Rethinking Reactivity
Computer, build me an app
The return of “write less, do more”

Other


Simplified Web App Development with Svelte
Svelte on the Changelog (Podcast episode)

Tutorials

Video based

Get started learning Svelte with video tutorials.

Svelte Master on youtube
Svelte with Chart.js
Svelte 3 quickstart tutorial

Text based

Get started with text-based tutorials.

Dave Ceddia - Svelte intro
R. Mark Volkmann - Web Development Simplified With Svelte
Practical Svelte: The use-directive

Courses

Follow a full course on Svelte.

Svelte JS: the complete guide (Warning: this is one of the few full-on video guides but author uses a lot of React habits during coding, YMMV)

Starter templates

Kickstart your project with these templates.

https://github.com/sveltejs/template

Specific components

Look into specific components to use into your projects.

Svelte Virtual List
Svelte Select
Svelte Input Mask

UI framework (re-)implementations in Svelte


Svelma
Svelte Material UI
Svelte Fomantic UI
Svelte Toolbox
SvelteStrap

Tools


MDsveX: a Markdown preprocessor for Svelte

REPL list

Interesting REPLs you can learn something from.

Responsive slider
Infinite scrolling calendar
Stagger animation
Themed buttons
SvelteGL
Undo/redo
Component composition: Panel example

Rollup related

Rollup is an option for the JS module bundler.
https://rollupjs.org/guide/en/
Rollup has several plugins to parse other file formats.
https://www.npmjs.com/package/rollup-plugin-svg
rollup-plugin-svelte
https://github.com/differui/rollup-plugin-sass
Updates - to be sorted!


Conditional transitions

https://svelte.dev/repl/060336c5dbcb4eafa2d0a612a87d769c?version=3.12.1


Svelte custom elements

https://www.youtube.com/watch?v=CO7vEjsw3cc&list=WL&index=1


Svelte 3 components in legacy apps

https://jimmyutterstrom.com/blog/2019/06/21/svelte-3-components-in-legacy-apps/?utm_campaign=Svelte Status&utm_medium=email&utm_source=Revue newsletter


Reorderable list

https://svelte.dev/repl/792a50449def47c69ee5a64d4e75c600?version=3.15.0


Apps using Svelte


Celestrak https://celestrak.com/cesium/orbit-viz.php?tle=/pub/TLE/catalog.txt&satcat=/pub/satcat.txt&referenceFrame=1
Svelte Poker https://github.com/buhrmi/svelte-poker

Archived

Older entries archived for various reasons.

https://github.com/jerriclynsjohn/svelte-storybook-tailwind
Baelte - CLI tool for svelte that helps you be productive.