Fetch API – JavaScript Tutorial for beginners

JavaScript Fetch API, how to use in with Promises, how it is different from XHR, and why use it?! This is episode 14 of 20 things Javascript Developers Should Know But Probably Don’t.

00:00:00 Intro
00:00:45 What is Fetch?
00:01:51 Request()
00:02:52 Response()
00:04:09 🔴 Demo: Simple GET
00:08:12 🔴 Demo: Simple GET with Parameters
00:10:58 Request Parameters
00:12:10 Headers
00:12:49 🔴 Demo: Headers
00:17:12 Error Handling
00:17:41 🔴 Demo: Error Handling
00:26:24 History of Fetch and XHR
00:25:40 POST Request
00:28:00 Why Fetch?
00:22:59 Outro

Links mentioned in the video:

List of Free APIs:
https://free-apis.github.io/
https://publicapis.dev/
https://rapidapi.com/collection/list-of-free-apis

ColorCode Etsy Merchandise store:
https://www.etsy.com/shop/ColorCodeStore

Episode 11: Asynchronous JavaScript:
https://youtu.be/QSqc6MMS6Fk

Episode 12: JavaScript Promises:
https://youtu.be/TnhCX0KkPqs

Episode 13: Async Await
https://youtu.be/spvYqO_Kp9Q

Using Fetch (MDN):
https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

Full playlist here: https://www.youtube.com/playlist?list=PL1PqvM2UQiMoGNTaxFMSK2cih633lpFKP

JavaScript Promises from the series “20 Things JS Developers Should Know but Probably Don’t”
by ColorCode.io, Sina Jazayeri

*** Announcement ***
Full JavaScript Mastery course is coming! Details at the end of the video. Sign up for Early Access here:
https://www.colorcode.io/js-mastery