Design comparison
Solution retrospective
I learned how to use local JSON data to dynamically populate website content. I used the fetch()
API along with the innerHTML
property to achieve this. Additionally, I performed a calculation for the total score and made it update dynamically in the HTML based on the JSON data.
If this were a real project, I would have included a method to dynamically calculate the ranking of the results. I considered adding it, but I chose not to because I didn't want to allocate time to create text content for it.
In addition, I learned different methods for creating transitions using the 'background-image' property, which enabled me to create transitions with gradients.
What challenges did you encounter, and how did you overcome them?I encountered difficulties when adding transitions to the 'background-image' property. After conducting some research, I discovered that you can utilize the background-position
to accomplish this.
Another challenge was using local JSON data to dynamically populate website content. I had no idea how to do this when I began the project, and I had to do a lot of research on the fetch()
API along with the innerHTML
property.
Any suggestions and comments on how I can improve are welcome!
Community feedback
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