Advice generator app

Community feedback

• 

  Elaine•11,400

  @elaineleungPosted over 2 years ago

  OH by the way! I just checked out your app, it looks like it has an issue that's fairly common when viewed on Firefox where the second advice won't load right way due to caching, and this is something I've seen on many of these solutions. You can test it out on Firefox and see as well. The way to fix this is to add a header object in fetch, like this:

  fetch("https://api.adviceslip.com/advice", { cache: 'no-cache' })

  Marked as helpful

  0

  ---

  

  P

  Jax Teller•670

  @piushbhandariPosted over 2 years ago

  @elaineleung thanks! yeah one of the things i need to work on is to test my code on different browsers.

  0
• 

  Elaine•11,400

  @elaineleungPosted over 2 years ago

  Hi Jax, I also used a transition animation for my app, and I did a quick update just now to add a similar translation effect so that you can see it in action. I see you using an "active" class here, which I think works fine for the task, so you just need the CSS for it. What I did was, I used an aria-hidden to toggle between the hidden and display states instead of using an "active" class, but I think you can still check out the JS and CSS as a reference. Good luck!

  My solution is here: https://www.frontendmentor.io/solutions/responsive-component-with-api-and-data-fetching-acBCRNQ6R9

  Marked as helpful

  0