Fetch and XHR with Bootstrap5 whilst Consuming NASA APOD API

Those space images are cool.

I realized this week that both XHR and Fetch are useful for consuming web apis. And, those NASA space images look so cool. Decided to put some sample code and blog it up.

As usual, the entire code is available, here.

There is not much to say here. Here is how XHR looks.

A few things to note.

1. XHR is old school. So, the amount of code required is more.
2. Further, you will notice that I am forced to depend on a Promise with resolve and reject. This makes perfect sense because XHR, as far as I know, does not have its own resolve features.
3. In fact, if you look at the full code file in the linked repository, you will notice that I ended up bundling the code into two distinct functions that give me the desired code.

Now, look at the fetch thing.

Some observations.

1. the code is simple and short.
2. I dont have to depend on my own Promise thing.
3. And, of course, it’s modern.

And, that’s all there is to it.

I work as a full time freelance coding tutor. Hire me at UpWork or Fiverr or Stack Overflow. My personal website is here. Find more of my art at Behance and Unsplash. Also, I have a Podcast about everyday life. And, a 2nd Podcast, where I talk about freelancing.