1
WTF is Svelte?
1m 7s
2
Create a new project with Svelte 3
33s
3
Add data to HTML markup using Svelte 3
35s
4
Add styles to Svelte 3 component
48s
5
Create a new Svelte 3 component to render it inside of another component
1m 16s
6
Declare and pass in properties to a Svelte 3 component
1m 18s
7
Compose components with slots in Svelte 3
1m 18s
8
Use named slots to compose multiple components in Svelte 3
1m 45s
9
Render HTML directly into a component in Svelte 3
46s
10
Use Svelte 3 transitions to gracefully show and hide DOM elements
1m 39s
11
Use reactive declarations to compute component state in Svelte 3
1m 27s
12
Loop over and render a list of data using an `each` block in Svelte 3
1m 15s
13
Use await block to wait for a promise and handle loading state in Svelte 3
1m 23s
14
Use DOM events and event modifiers in Svelte 3
1m 22s
15
Use an onMount lifecycle method to fetch and render data in Svelte 3
1m 4s
16
Use Svelte 3 stores to share data between multiple unrelated components
1m 44s
17
Set a value to a Svelte 3 store
45s
18
Use auto-subscriptions in Svelte 3 to avoid memory leaks when using Stores
1m 17s
19
Tween a value and dynamically update the DOM with Svelte 3
1m 32s
20
Create a new Svelte project with TypeScript support
3m 35s

Use await block to wait for a promise and handle loading state in Svelte 3

svelte

Share this video with your friends

Most web applications have to deal with asynchronous data at some point.

Svelte 3 apps are no different, luckily Svelte allows us to await the value of a promise directly in markup using await block.

In this lesson we're going to learn how to use the await block to fetch the data from a Star Wars API and both display the data and handle loading state.

Course

Up and running with Svelte 3

Frederik

~ 4 years ago

This API is no longer available...

I'm having some trouble finding a replacement. I'm currently using fakeapi.jsonparseronline.com , e.g. this endpoint:

http://fakeapi.jsonparseronline.com/users

Lucas Minter

~ 3 years ago

This API is no longer available...

The api has changed from a .co to a .dev. Use this link instead: https://swapi.dev/api/people/

Frederik

~ 3 years ago

Thanks for letting me know!