HTTP Requests, XHR, and Fetch! 🔮
![](https://substackcdn.com/image/fetch/w_1456,c_limit,f_auto,q_auto:good,fl_progressive:steep/https%3A%2F%2Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%2Fpublic%2Fimages%2F4e2c87f6-ccb4-42ed-89da-400d8d82c08c_1200x400.png)
Hi, *|USERNAME|*!
Everything we see on the internet is powered by web requests. This is the mysterious task where our computer asks for something like an HTML document, an image, stylesheet, font file, etc. and another computer (commonly called a server) somewhere in the world processes our ask and sends the data back to us. A lot of this requesting happens automatically as part of us navigating from one page to another.
Now, if we are building our own app that needs to handle requesting data from another computer, very little happens automatically. It is up to us to generate a web request and process the returned data ourselves. While that sounds complicated, it doesn't have to be. In my latest article, Making HTTP/Web Requests, we walk through how to make a web request, send the request off, patiently wait for a response, and process any data returned by the response.
To make this (fairly boring task) more relatable and fun, we build a simple example along the way where we request our current IP address from a remote server, ipinfo.io:
By the end of it, you will have learned not only how to make a web request in JavaScript like a pro, you will have learned to use the more modern fetch approach as well as the more traditional xmlhttprequest (XHR) approach in case you spend time looking at older-ish code.
TILL NEXT TIME!
As always, before I leave you to it, I would love to hear from you on things I can do better, topics you'd like me to write about, and more. Don't be shy! The easiest way to contact me is via Twitter (follow me if you don't!) or by posting on the forums.
Cheers,
Kirupa 😃