Design comparison
Solution retrospective
Fetching API and rendering it was a challenge but it became easy once I got a hold of the basics of React. A harder challenge was to get GitHub to host the website, which took me a long time since I had no idea what to do. Glad it finally worked!
Community feedback
- @elaineleungPosted over 2 years ago
Hi Bao Dang, great job building this with React, and I like your slowly spinning dice!
I'm using Firefox, and I see that there's a caching issue here that's common for these solutions, where on Firefox, the next advice could not be loaded due to caching. If you have Firefox, you can try it out too. What you need to do is to add a header object for fetch, like this:
fetch("https://api.adviceslip.com/advice", { cache: 'no-cache' })
Since this is a React app, you might need more configurations for GitHub and could get complicated (GH Pages is designed for static pages only and I think static site generators also work). I also use GH Pages usually, but for React I would deploy my repo using Vercel instead.
Great job once again, wish I got to see the advice working though!
Marked as helpful1@weebaoPosted about 2 years ago@elaineleung Thank you so much for your advice! Sorry for replying late, but I fixed it as you said and it worked wonders! I am creating another react app right now, so I will also try to use Vercel. Have a good day!
1@elaineleungPosted about 2 years ago@weebao Glad to help! I just checked it out again and it's working well 😊
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