Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

egghead.io

Up and running with Svelte 3

via egghead.io

Overview

JavaScript community has been shaken recently by a release of Svelte 3 and for a good reason - it's a completely different approach than React or Vue. To quote the docs:
"Svelte is a radical new approach to building user interfaces. Whereas traditional frameworks like React and Vue do the bulk of their work in the browser, Svelte shifts that work into a compile step that happens when you build your app."
The best part? If you have 26 spare minutes you can learn the basics of Svelte 3 and start building your own apps with it!
If you're interested in Svelte this is the best resources to get our familiar with its core features. You'll learn everything you need to start building Svelte apps today.
Enjoy!

Syllabus

  • WTF is Svelte?
  • Create a new project with Svelte 3
  • Add data to HTML markup using Svelte 3
  • Add styles to Svelte 3 component
  • Create a new Svelte 3 component to render it inside of another component
  • Declare and pass in properties to a Svelte 3 component
  • Compose components with slots in Svelte 3
  • Use named slots to compose multiple components in Svelte 3
  • Render HTML directly into a component in Svelte 3
  • Use Svelte 3 transitions to gracefully show and hide DOM elements
  • Use reactive declarations to compute component state in Svelte 3
  • Loop over and render a list of data using an `each` block in Svelte 3
  • Use await block to wait for a promise and handle loading state in Svelte 3
  • Use DOM events and event modifiers in Svelte 3
  • Use an onMount lifecycle method to fetch and render data in Svelte 3
  • Use Svelte 3 stores to share data between multiple unrelated components
  • Set a value to a Svelte 3 store
  • Use auto-subscriptions in Svelte 3 to avoid memory leaks when using Stores
  • Tween a value and dynamically update the DOM with Svelte 3
  • Create a new Svelte project with TypeScript support

Taught by

Tomasz Łakomy

Reviews

4.7 rating at egghead.io based on 83 ratings

Start your review of Up and running with Svelte 3

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.