I decided to use fetch to make the API call, but whenever I ran it in Firefox, the call got cached and would return the same result over and over again. It works as expected in Chrome. Does anyone know what would cause this in Firefox? Also if anyone has tips on centering the button on the container div, I would really appreciate it.
Hello there 👋. Congrats on completing the challenge!
To resolve the caching issue, you can set the cache option in your fetch call to 'no-cache' to prevent the browser from caching the response, like so:
fetch('https://api.adviceslip.com/advice', {cache: "no-cache"})
Alternatively, the Advice Slip API has an option to get a specific advice slip if you provide an id number at the end of the URL. You could append a random number to the URL and it which would bypass the caching on the server side.
Hello there 👋. Congrats on completing the challenge!
I've noticed a small glitch with application. It seems you've set the max-width of the body to 1440px. As a result, the container and its child elements are not centred if the browser width is larger than 1440px. If I can make a suggestion, setting the max-width to 100vw or 100% should resolve this issue.
Helloe frontenders - please check out my solution - have added some rad animations
Hello there 👋. Congrats on completing the challenge!
I've noticed a small glitch with application. When viewing your app on Firefox, the browser caches the response from the first API call. This would result in subsequent fetch calls to not retrieve a new advice slip.
To resolve this, you can set the cache option in your fetch call to 'no-cache' to prevent the browser from caching the response.
Alternatively, the Advice Slip API has an option to get a specific advice slip if you provide an id number at the end of the URL. You could append a random number to the URL and it which would bypass the caching on the server side.
