YoVDO

Up and running with Svelte 3

Offered By: egghead.io

Tags

Svelte Courses Web Development Courses Typescript Courses User Interface Design Courses Reactive Programming Courses Component-Based Architecture Courses

Course Description

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

Related Courses

Angular 17
LearnQuest via Coursera
Angular 17 Overview & Basics
LearnQuest via Coursera
Using Angular 2 Patterns in Angular 1.x Apps
egghead.io
Angular: Building an Interface
LinkedIn Learning
Angular Essential Training
LinkedIn Learning