This was my first time using an API. It was a lot fun and it opens up so many possibilities with what I can build now.
How does my JavaScript look? Is there anything that could be better as far as best practices go?
Due to API specifiց things, this one always returns cached response and because of that it can seem that button to request new advice does not working. To solve this, you can add to your fetch function option to not receive cached data like this.
function getAdvice() {
fetch("https://api.adviceslip.com/advice", {
cache: 'no-cache'
})
.then(response => response.json())
.then(data => updateUI(data))
}
Also you can try to replace then/catch with async/await.
async function getAdvice () => {
try {
const response = await fetch('https://api.adviceslip.com/advice', {
cache: 'no-cache'
});
const data = await response.json();
updateUI(data)
} catch (err) {
alert(err.message);
}
};
Hello, Frontend Mentor community! This is my solution to the Advice Generator app.
I have read all the feedback on this project and improved my code. Due to the fact that I published this project very long ago, I am no longer updating it and changing its status to Public Archive on my Github.
You are free to download or use the code for reference in your projects, but I no longer update it or accept any feedback.
Thank you
Hi! I noticed the same issue with the API call response in Firefox as i experience by myselfe while was doing this challenge. After first call you always get the cached response and result doesn't change. To solve it you can add to your fetch option "fetch(apiUrl, {cache: "no-cache"})". For more information https://developer.mozilla.org/en-US/docs/Web/API/Request/cache.
Besides that, nice work!
Hi guys,
I have a question for you, why the background images doesn't show when I'm going to deploy my page. In VS Code there is no problem.
Please help me and Check my code.
Thank you.
Put path to the image into quotes. Now it's background-image: url(/images/bg-header-mobile.png);
But it should be background-image: url('/images/bg-header-mobile.png');
