Wait for one API call to finish before executing other

Question

I have to make two api calls on one page, one is to fetch categories and other is to fetch products that belongs to that categories, first I have to fetch categories and once it is successfully fetched then I have to make Product api call to fetch Products, please let me know how this can be achieved.

Answer 1

You can us async/await:

const categories = await fetch(path1);
const product = await fetch(path2);

// Do something after...

or by implementing nested fetches:

fetch(path1).then(categories => {
   fetch(path2).then(product => {
      // Do something after...
   });
});