Learn Fetch API In 6 Minutes

  Рет қаралды 1,288,442

Web Dev Simplified

Web Dev Simplified

Күн бұрын

Пікірлер: 669
@ProgrammingwithPeter
@ProgrammingwithPeter 5 жыл бұрын
Best 6 mins of KZbin that I watched today
@WebDevSimplified
@WebDevSimplified 5 жыл бұрын
Thank you so much!
@whitecircle626
@whitecircle626 4 жыл бұрын
Programming with Peter 6:35
@rameshsrivastavachandra
@rameshsrivastavachandra 4 жыл бұрын
true
@FuknNoName
@FuknNoName 3 жыл бұрын
Agreed :)
@FurTuna13
@FurTuna13 5 ай бұрын
Indeed it is
@sergiearruda443
@sergiearruda443 3 жыл бұрын
Be like Fetch, always succeed even when you fail
@rendoesmath
@rendoesmath 3 жыл бұрын
Two comment bots oof
@outside7
@outside7 3 жыл бұрын
The Trump of JavaScript. lol
@FrankUnderwoood
@FrankUnderwoood 3 жыл бұрын
That's deep man
@terry9873
@terry9873 3 жыл бұрын
@@outside7 no
@anonimous4798
@anonimous4798 2 жыл бұрын
@@terry9873 yes
@plaguegames3556
@plaguegames3556 4 жыл бұрын
At last someone who explains the reason behind every action. Most of the instructors just want us to copy paste and do not explain why we need to do sth, and what is the meaning of the action. Great Job 👍
@BrunoMCDowell
@BrunoMCDowell 2 жыл бұрын
Spot on!
@djkly1
@djkly1 2 жыл бұрын
I said this same thing 1/4 way through a previous vid.
@mohammadhisbullah9332
@mohammadhisbullah9332 10 ай бұрын
exactly so !
@kvncnls
@kvncnls 4 жыл бұрын
Took 6 minutes and now I can use Fetch for all of my JavaScript projects. Thank you!
@randalfjohn9848
@randalfjohn9848 2 жыл бұрын
Exactly
@sajaljaiswal1659
@sajaljaiswal1659 2 жыл бұрын
This channel is really helpful for people like me who had studied some web stuff before but didn't keep in touch with it. I really don't want to go over hours of lectures studying what I already know but have forgotten. Great resource.
@petertester915
@petertester915 5 жыл бұрын
Your videos are invaluable, the direct effect you are having is bringing novice developers up the notches to an intermediate / advanced level. I have been using the fetch() method for a while now, but the in depth analasyis lets me connect the dots, enables me to become a better developer. Keep on going!
@WebDevSimplified
@WebDevSimplified 5 жыл бұрын
That is awesome! The goal with my channel is to help people understand new technology and tools better than they already do and I am so glad I am able to do that for you.
@StefanVanderVyver
@StefanVanderVyver 2 жыл бұрын
Sometimes it takes someone to use slightly different words in order for the explanation to land. I think you have a gift. Well done on this video, and step by step explaining the double promise in fetch. Also, simply by saying "you can use asynce/await OR then" you put so much clarity into my mind. Keep going.
4 жыл бұрын
Man! This is really web dev simplified! I enjoyed this video so much and it clarifies everything!
@abdelazizelshrkawy5193
@abdelazizelshrkawy5193 Жыл бұрын
the mighty solution for every problem you are actually one of the best people who explain the problem or teach others in fantastic way which make the listener not only know the answer but to understand the details thank you I wish the best to you
@marlish6235
@marlish6235 2 жыл бұрын
Simple, clear and straight to the point. Excellent video.
@noveltechmedia
@noveltechmedia 4 жыл бұрын
Great video, much better than reading the documentation. One thing that would also be interesting is if you showed how to use async and await with fetch. Keep up the good work :)
@alexzimmerman3447
@alexzimmerman3447 2 жыл бұрын
100% the best JS videos I've found on KZbin. You got me hooked with the Promise video, and now here we are! Thank you!!
@bmac-cz6rk
@bmac-cz6rk 4 жыл бұрын
Its so amazing that I have been struggling with promises and the fetch api all week, reading docs and trying to grasp it, then this video shows up and clears all my problems away. Forever grateful to you Kyle! You gained my support today!
@dannuttle9005
@dannuttle9005 4 жыл бұрын
Could you please make a video explaining your setup, including how you avoid CORS errors?
@markubben
@markubben 4 жыл бұрын
If you got a CORS error, you most likely typed in regres inteasd of reqres in the reqres.in.... I did the same thing. Double check your URL to be correct.
@ThDravuz
@ThDravuz 4 жыл бұрын
adding "cors-anywhere.herokuapp.com/" to the front of your api url should remove "No Access-Control-Allow-Origin header" cors errors. For example: "cors-anywhere.herokuapp.com/yourAPI.com"
@mayank_upadhyay_19
@mayank_upadhyay_19 4 жыл бұрын
@@markubben Holy shit, you are right 😅
@samuelp7847
@samuelp7847 3 жыл бұрын
@@ThDravuz You my friend are the Hero we all need.
@kurtheimerman8267
@kurtheimerman8267 2 жыл бұрын
@@markubben Thank you, that was my problem.
@ranamuzamal9655
@ranamuzamal9655 3 жыл бұрын
One of the best tutorial of Fetching datta from API , i hhave searchout many here on google and youtube ,Really you are the best one
@jgwilk
@jgwilk 4 жыл бұрын
the most simple, easy to understand explanation of fetch I've seen! Nice job 👏
@WebDevSimplified
@WebDevSimplified 4 жыл бұрын
Thanks!
@manasnagelia
@manasnagelia 2 жыл бұрын
Absolute legend, banged my head on the keyboard for hours, until I found out I had to set the headers as application/json. Thank you.
@digigoliath
@digigoliath 4 жыл бұрын
If you have 6 mins to spend, spend it on this video!
@alexlindgren1
@alexlindgren1 3 жыл бұрын
Really appreciate your videos man, so thankful for you giving them away for free. I'm already enrolled in another course, but if I'm not satisfied with what I'm going to learn about react I'll check out your course on that - I like the way you describe things so it's easy to understand of how it all comes together.
@kurtheimerman8267
@kurtheimerman8267 2 жыл бұрын
Exactly what I was thinking
@SJY11
@SJY11 11 ай бұрын
In 6 minutes you covered basically everything you need to know about fetch! I love how explained the corner cases for every line (like why we use JSON.stringify or how .catch() only catches fetch-related errors) potentially saving us from many unexplained bugs and sleepless nights! Thank you so much, Kyle! You're the GOAT!
@timucintarakc2281
@timucintarakc2281 Жыл бұрын
best java script channel in youtube. thank you very much. i actually wathed multiple videos on this before. you were the only one who expalined it very well.
@ameyajoshi5673
@ameyajoshi5673 Жыл бұрын
OMG I quickly wanted to revise JS Fetch very quickly and this helped a lot. Awesome Video thanks!
@rishabbhattachaya6676
@rishabbhattachaya6676 9 ай бұрын
recently got into this channel and watching your recent videos compared to something older its amazing how far you've come. thank you for everything sensei
@ghanashrim2839
@ghanashrim2839 3 жыл бұрын
I have been following your videos for a long time now, your voice is very soothing to hear man!
@Ipdxcreative
@Ipdxcreative 3 жыл бұрын
I just wanted to say thank you so much for helping me understand these concepts in such a simple manner!
@jumboliah13
@jumboliah13 9 ай бұрын
Your style of teaching is fantastic. I hope somebody gave you some kind of award, you deserve it.
@scyfox.
@scyfox. 2 жыл бұрын
Man, I lost hours today following a tutorial that has a mistake (or lack of explaining) but this was awsome to understand and follow along. I made a post in my personal blog linking back to you. Great content!!
@cllhicqani9678
@cllhicqani9678 Жыл бұрын
i have never seen a motivated helper like you. may god bless you. You made me understand what I was confused about it. the best video i've ever seen.
@omarpervez5657
@omarpervez5657 2 жыл бұрын
Hi Kyle, My name is Omar. I have been following you for 1.5 years.I knew lots of things from you. Thank you so much for your all Videos 😍😍
@CaptWindShear
@CaptWindShear Жыл бұрын
Thank you, sir, for not trying to blind me with science. It is convoluted enough as it is, but you made it make sense.
@SuperQuwertz
@SuperQuwertz 3 жыл бұрын
Dude, youre a life saver. Best Channel for Webdevelopment on KZbin.
@mobigeek666
@mobigeek666 3 жыл бұрын
Thank you so much bro!!! I asked this guy to help me with the .then() method and he made a whole video!!! thank you so much. now i understand what goes on behind the scenes.
@thomasviles8158
@thomasviles8158 3 жыл бұрын
Everything I search for as I learn Javascript,, this guy has the best videos. Thanks for all of the help man!!!
@gearzanimation
@gearzanimation 2 жыл бұрын
Literally the best code tutorials on the internet from this guy. SO GOOD!
@dharshan5309
@dharshan5309 2 жыл бұрын
Anyone tellme, we are checking if the response is ok in then but we are removing the res.Json. at 4:24 the data is undefined even when we are getting the successful fetch. How to get the data in json format
@uulecrocodile8437
@uulecrocodile8437 2 жыл бұрын
the best and most informative 6 minutes ever spent on KZbin
@fodecissokho9918
@fodecissokho9918 Жыл бұрын
This is by far the best tuto I've ever seen Eveything is detailed under just 6 minutes, Keep it up G👌👌👌👌
@skylarw19
@skylarw19 3 жыл бұрын
Question: Why do we need to actually need to use the word, "return", at 5:12 for the res.json()? In earlier parts of the video, it seemed fine to just have .then(res => res.json()) instead of .then(res => return res.json()). Any clarity is much appreciated! Loved this video, super helpful in explaining everything. This was the only thing I had a question on.
@crystallizedsyrup7594
@crystallizedsyrup7594 3 жыл бұрын
Late response, butthe reason why return needs to be used is so the json value could be stored in a variable, such as var data = fetch(...). Without the return you did not assign what data that should be given to the variable data after fetch is run.
@davidspot191
@davidspot191 5 ай бұрын
Oh my, I really love this simplication 😍😍I've been trying to understand this from more than 3 videos but I was just watching and not even understanding it. Loved how you really break this down from the start. Thanks sooo much Dev 😄😄
@lititiakorau9487
@lititiakorau9487 2 жыл бұрын
Kyle you are such a great teacher bless you!!
@lidestudios5094
@lidestudios5094 Жыл бұрын
since I have college and programming is something I do on the side, I never really have enough time to learn about this stuff. But this 6-minute video was just what I needed, short and straight to the point while also managing to explain what everything does. Thanks so much!
@csanya25
@csanya25 2 жыл бұрын
Nice video. Helped me a lot understand and implement this knowledge at my first API call. :)
@ayMillmusic
@ayMillmusic 9 ай бұрын
Such a great video man! Hair is looking super dope too!
@kerimtim
@kerimtim 2 жыл бұрын
Kyle makes everything so easy to learn
@zephieethan7168
@zephieethan7168 2 жыл бұрын
your videos always let me learn new. even though i thought i know this point.
@evanoffhandson7067
@evanoffhandson7067 Жыл бұрын
This guy's channel is awesome. Taking a $14,000 course right now and I still come to his videos for clarification.
@phamtienthinh1795
@phamtienthinh1795 Жыл бұрын
Thank you, I was struggling at header and body, this video is like my life savior
@pale-face
@pale-face 2 жыл бұрын
The best video on Fetch I have ever watched.
@mikeshilovski1512
@mikeshilovski1512 4 жыл бұрын
Jesus, You're a genius! Thank you so much for the video!! Finally understood it all
@Brezanova
@Brezanova 2 жыл бұрын
I am in a bootcamp and your videos are a crucial part of my understanding the lectures .. You are a truly amazing teacher. May I ask you what equipment you are using for your production (Camera and Microphone?) Thank you for all your work. I will be signing up for your courses as soon as I get to breath and slow down with the bootcamp.
@SnappyScience
@SnappyScience 2 жыл бұрын
Great video and thank you for going through the potential bugs rather than just showing working code. Learnt a lot.
@waynezeeman8948
@waynezeeman8948 Жыл бұрын
Many thanks for explaining this topic so well. It has just solved my 2 week struggle with Fetch👍
@cristi8997
@cristi8997 Жыл бұрын
thanks man, I was so confused why api error would return a success case, now I get it
@SJY11
@SJY11 11 ай бұрын
Kyle, you're also one of the few youtubers who actually includes the materials referenced in the video in the description! I know it's an easy thing to forget, but I appreciate the attention to detail :)
@saladin_advanced
@saladin_advanced 2 жыл бұрын
Thank you. Your explanation way and your videos are really smart 👍
@debopamgupta
@debopamgupta 4 жыл бұрын
Best video that made me understand every thing about fetch because every time after watching a lot of projects when I write something it doesn't work as because I mess up the fetch statement....
@frischsticks
@frischsticks 6 ай бұрын
One of the best coders on KZbin. Making things simplistic, when my professors from years past had failed me. 6 mins and now I understand fetch...
@pantepember
@pantepember 3 жыл бұрын
Soothing voice, clear, concise, and well-prepared explanation. Awesome!
@ondine9997
@ondine9997 3 жыл бұрын
Hey, do you know what the three calls to fetch() are?
@yasirtahirkheli74
@yasirtahirkheli74 2 жыл бұрын
The perfect explanation. long live mate. you are probably the best and the most thorough professional who has the ability to explain in accurate details.
@tyoung7167
@tyoung7167 3 жыл бұрын
Thank you. Great tutorial! Any beginner Fetch API Tutorials for displaying random images?
@pysof
@pysof 4 жыл бұрын
Bro your videos are absolutely awsome! I hope your channel keeps growing up! Keep it up.
@42svb58
@42svb58 3 жыл бұрын
You are better than my professor in graduate school explaining this...at a nationally ranked program
@michaelcarnevale5620
@michaelcarnevale5620 3 жыл бұрын
srs this is the best channel if i need to just learn a quick specific thing
@Acuce7ibd468j
@Acuce7ibd468j 2 жыл бұрын
Your videos are helping alot . Keep going 👍👍
@vont8424
@vont8424 3 жыл бұрын
I'm alittle confused here: in this statement: .then(res => console.log(res)), isn't res => the parameter used in the function, when written in arrow function syntax? but why you said that res is the response object? can you explain to me? thanks!
@danyleveque892
@danyleveque892 4 жыл бұрын
Clear and concise. It would be great if you can explain how to send form data using the FormData object too and any alternate ways of sending form data to an endpoint
@bhagyashreekhairnar683
@bhagyashreekhairnar683 Жыл бұрын
Hey thanks for making this video! Needed the help! Can you also explain where you're fetching this data from (reqres link - what exactly is it? why did you choose it?) and how do we decide from where can we make fetches?
@digital-ali5763
@digital-ali5763 2 жыл бұрын
Hey kid, you're good at this! 6 minutes and I know what I'm doing!😀
@ricardoaguiar616
@ricardoaguiar616 3 жыл бұрын
You have the gift of making things understandable! Thank you for your help!
@keronwilliams5392
@keronwilliams5392 2 жыл бұрын
Dudeeeeeee straight to the point, love it!
@taylorgraham2906
@taylorgraham2906 4 жыл бұрын
The links to other videos were SUPER helpful. Thanks, man!
@bintoucisse2415
@bintoucisse2415 2 жыл бұрын
Thank Kyle! You were very helpful as always! You're very pedagogue
@phil7121
@phil7121 5 ай бұрын
5:25 YOU DA REAL MVP I was stuck for an entire day because of this
@dan110024
@dan110024 3 жыл бұрын
A neat thing I saw someone do to demonstrate JSON.stringify was logging both versions of the object in the console. Like a before and after. It helps visualise what's happening.
@jhonatansantofimio3764
@jhonatansantofimio3764 2 жыл бұрын
me too, you find the solution?
@mutley11
@mutley11 2 жыл бұрын
That was a very skillful demonstration; you are a wonderful teacher. Thank you.
@haseebpavaratty6249
@haseebpavaratty6249 4 жыл бұрын
Glad I found you. Never stop making these. Thanks :)
@darryl8349
@darryl8349 Жыл бұрын
Thank you so much you have helped me solve a problem ive been stuck on for like an hour
@aabid3375
@aabid3375 4 жыл бұрын
How did u maintain that delivery speed with so much clarity.Simply amazing.
@MarcoussC
@MarcoussC Жыл бұрын
Nice Video thanks! Question - how do I extract the ID number in a variable to use later on?
@djl7390
@djl7390 4 жыл бұрын
First, fast reading 'Using Fetch' in mozilla developer site (developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch) Second, see this video, Third, repeat first step. It is very efffective. Thanks for sharing this great video.
@wingowingo2928
@wingowingo2928 4 жыл бұрын
Subscribed. The tips presented are well and useful. What's the model of your webcast microphone? The audio is really good and your voice is easy to the ears.
@MUSHIN_888
@MUSHIN_888 Жыл бұрын
Awesome dude, I learnt the very basics of JS last weekend and now im trying to learn more of the fundamentals to start using it properly.
@princejones0077
@princejones0077 3 жыл бұрын
Kyle, how do u save an output into a variable that I can access outside of fetch?
@InstaSound
@InstaSound 3 жыл бұрын
I also struggle with this
@compact1277
@compact1277 3 жыл бұрын
Instead of displaying the data in the browser console, is it possible to take the data from the response into your code, and store the data?
@EvertvanIngen
@EvertvanIngen 3 жыл бұрын
Looks right into my soul, "I'm gonna steal that" TT
@jeffkorenstein5507
@jeffkorenstein5507 3 жыл бұрын
This is great! This would be even more helpful to show with a "PUT/PATCH" request in addition to the "POST".
@loulamperouge2557
@loulamperouge2557 3 жыл бұрын
does res.json() returns a promise by default? because i get confuse with the syntax where i think it's in 3:00 where you didn't specify the "return" keyword in res.json().. but at 5:27 you specify the "return" keyword before the res.json()
@memeline7015
@memeline7015 Жыл бұрын
god bless thee! I had a hard time reading docs. this video helped me!
@wilsonfaustino
@wilsonfaustino 5 жыл бұрын
Man, I really enjoy your channel. Please, zoom a little bit, because I watch over the phone and it’s kinda hard to see what you’re writing and to keep up with the tutorial. Thank you again. Greetings from Brazil.
@WebDevSimplified
@WebDevSimplified 5 жыл бұрын
Thanks for the suggestion. I will see what I can do.
@AbbosShodiev-z8t
@AbbosShodiev-z8t 10 ай бұрын
Straight on point tutorial! Great Job!
@derrickk2916
@derrickk2916 Жыл бұрын
Overall excellent. I think you should have discussed CORS, a serious stumbling block for newcomers
@MaxSharpy
@MaxSharpy 9 ай бұрын
Thx Kyle! As always, wonderful content!
@gopinathkrm58
@gopinathkrm58 4 жыл бұрын
is it possible to take out the received response data and store it a variable and use it in some other function.. for example: var temp; fetch('some url') .then(function(res){ return res.json(); }) .then(function(data){ temp = data; return data; }) .catch(function(err){ console.log(err); }); is this a correct format?
@fabiofreitas9304
@fabiofreitas9304 3 жыл бұрын
Simple and efficient. The best explanation about fetch i've ever seen...
@faisalmehmood5375
@faisalmehmood5375 4 жыл бұрын
Super useful. Helped me on my path to learning how to query a database through a server.
@paulmcok
@paulmcok 3 жыл бұрын
Great tutorial and very clear!... Turns out it's not what I needed in this instance (so good job I watched it) but definitely useful for future road blocks. I've subscribed.
@RomilJain-wt3lb
@RomilJain-wt3lb 3 жыл бұрын
Great video, loved it, please keep doing great work
@glupiajak
@glupiajak 3 жыл бұрын
Beautiful tutorial as always! Is there any particular reason you use *.then* instead of *async* / *await* ?
@bigazTV
@bigazTV 2 жыл бұрын
Async await is another way of making calls
@mactavish7287
@mactavish7287 4 жыл бұрын
Bravo! My first ever video of your channel. Well explained in actually 6 mins. No bullshit. PS: This is the first time I came across fetch. I have been using axios but NOW I think fetch is also nice!
@ammarhalees6370
@ammarhalees6370 5 жыл бұрын
You are a great instructor!!! What a great explanation!
@WebDevSimplified
@WebDevSimplified 5 жыл бұрын
Thank you!
@averyrobbins68
@averyrobbins68 3 жыл бұрын
Just subbed because of this video. Thanks man.
Fetching Data in React - Complete Tutorial
29:10
Cosden Solutions
Рет қаралды 122 М.
Learn JSON in 10 Minutes
12:00
Web Dev Simplified
Рет қаралды 3,2 МЛН
Ничего не делаю всё видео 😴
00:33
Miracle
Рет қаралды 744 М.
Остановили аттракцион из-за дочки!
00:42
Victoria Portfolio
Рет қаралды 3,4 МЛН
Running With Bigger And Bigger Lunchlys
00:18
MrBeast
Рет қаралды 63 МЛН
Learn Express JS In 35 Minutes
36:03
Web Dev Simplified
Рет қаралды 812 М.
1.1: fetch() - Working With Data & APIs in JavaScript
15:39
The Coding Train
Рет қаралды 453 М.
APIs Explained (in 4 Minutes)
3:57
Exponent
Рет қаралды 870 М.
JavaScript ES6 Arrow Functions Tutorial
9:32
Web Dev Simplified
Рет қаралды 832 М.
Node.js Doesn’t Suck Anymore
16:59
Web Dev Simplified
Рет қаралды 106 М.
How to FETCH data from an API using JavaScript ↩️
14:17
Bro Code
Рет қаралды 130 М.
How to use a real API in your web app (rapidAPI tutorial)
12:53
React Tutorial for Beginners
1:20:04
Programming with Mosh
Рет қаралды 3,1 МЛН
GET Data from API & Display in HTML with JavaScript Fetch API
5:50