Advice Generator

Hi Prabu! Great work overall!

You can make your code more robust implementing errror handling on fetch. Here is my implementation.

async function getData() {
  const res = await fetch('https://api.adviceslip.com/advice');
  if(!res.ok) throw Error("There is something wrong!"); //throw error if fetch failed
  return await res.json();
}

const adviceCard = document.querySelector("main");

const udpdateDOM = (slip) =>{ 
  adviceCard.querySelector("span").innerText = `ADVICE #${slip.id}`;
  adviceCard.querySelector("h1").innerText = `"${slip.advice}"`;
}

async function setAdvice() {
//catch the error down here
  try {
    const { slip } = await getData();
    udpdateDOM(slip);
  }catch (err) {
    console.error(err);
  } 
}

Hi Prabu, glad you had fun with this challenge (I did as well), and I think you did well in putting it togoether 🙂

One small issue right now is, I'm viewing it on Firefox and I'm unable to load the next advice, which is a commonly seen issue due to caching. If you have Firefox you can also check it out yourself. What you can do is add a header object in fetch with a line for cache, like this:

const res = await fetch("https://api.adviceslip.com/advice",  { cache: 'no-cache' });

You can also try to add some error handling to your getData() function!