Idag har vi kikat på Promises och hur vi kan använda dem för att slippa ”Callback Hell” och göra vår kod renare och lättare att följa.
Vi gjorde en enkel workshop på förmiddagen i promises där ni skrev om fredagens workshop-uppgift till att använda Promises istället för callbacks.
Därefter gick vi igenom Fetch som är ett modernare sätt att göra HTTP-requests på än XMLHttpRequest och som returnerar Promises.
Läs mer om Promises och Fetch på länkarna nedan, och kika även på 94-96 från kapitel 12 i Udemy-kursen Modern JavaScript (from Novice to Ninja):
- 94. Promise Basics [12 min]
- 95. Chaining Promises [5 min]
- 96. The Fetch API [7 min]
Länkar
Understanding promises in JavaScript
https://hackernoon.com/understanding-promises-in-javascript-13d99df067c1
Promises In Javascript A Complete Guide For 2019
https://dev.to/nileshsanyal/promises-in-javascript-a-complete-guide-for-2019-4o99
How to Use the JavaScript Fetch API to Get Data
https://scotch.io/tutorials/how-to-use-the-javascript-fetch-api-to-get-data
Workshop
Under förmiddagens korta workshop i promises så skrev vi om uppgiften från i fredags till att använda Promises istället för callbacks.
Eftermiddagens workshop är att använda Fetch för att hämta ut data från Random User Generator’s API och skriva ut t.ex. namn, adress, telefonnummer och bild till DOM.
Bonus om ni lägger in stöd för att hämta ut flera användare (lägg till ?results=5 i URL:en så får ni 5 användare istället för bara en).
Till nästa lektion
Gör workshopen ovan, och kolla också på video 94-96 från kapitel 12 i Udemy-kursen Modern JavaScript (from Novice to Ninja) för repetition av dagens lektion:
- 94. Promise Basics [12 min]
- 95. Chaining Promises [5 min]
- 96. The Fetch API [7 min]