Lesson 2 of 8
Fetching data with await
- 13 min
- 4 checks
- 3 hints
- Go to task
Goal
Await the data, then show it
Explanation
Every data fetch goes through the same three steps: you request the data, wait for it to arrive, then display it. The await keyword turns the waiting into an ordinary line of code instead of a chain of then calls.
Here we use api(), a mock function that behaves exactly like fetch: it returns a promise that resolves a moment later. The only difference is that it doesn't need a network, so what you learn here is exactly what you'll write with fetch.
And remember: any function that uses await has to be async.
Your task
Fetch the data when the button is clicked, and show the city and the temperature.
Checks
4 checks- The values are empty before the click
- The city appears after the fetch
- The temperature appears
- The fetch really waits and the result doesn't appear instantly