Up and running with Svelte 3
Offered By: egghead.io
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!
"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 17LearnQuest 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