Responsive UI with flexbox, position and JS API Call
Design comparison
Solution retrospective
This is my first time calling an API using Javascript and using the new async await feature.
Please let me know if you see any improvements.
Having Feedback is always good
Community feedback
- @elaineleungPosted about 2 years ago
Hi Gaurab, I tried to click on the repository link but I think you had pasted the link to another challenge's repo, so you might want to change that!
In any case, great work on this app 😊. I did find your repository, and I think you're done a good job using
async/await
. The only thing I suggest is adding error handling, which you can try usingtry/catch
.One issue I found is that, I'm viewing this on Firefox and the next advice is unable to load, which is most likely due to caching. You can try this as well and see whether it's an issue for you. To fix this, you can try adding a header object in the fetch method, like this:
fetch("https://api.adviceslip.com/advice", { cache: 'no-cache' })
Marked as helpful1@Gaurab019Posted about 2 years ago@elaineleung, I have updated the code and it seems to be working now in firefox. Can you please have a look at the code and let me know if you see any more improvements?
1@elaineleungPosted about 2 years ago@Gaurab019 It works well on Firefox, great job!
One other suggestion I have is to add
cursor: pointer
to the dice icon so that users know that element is interactive. You'd always want to try to use a pointer for interactive elements 🙂Marked as helpful0 - @Gaurab019Posted about 2 years ago
Hi Elaine, Thanks for your feedback. I had indeed put the incorrect source code link, I updated the link.
I will definitely update the code with try catch block. I will also check for the status code of the response when I place the data so that I don't get something like undefined there.
I did not face any load issue when I tried it in chrome. I have just tried it in Firefox and I see the same issue. I will add that code that you had suggested and try again in Firefox
1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord