Frontend Mentor - Results summary component solution

This is a solution to the Results summary component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • What I learned
  • Useful resources
• Author

Overview

The challenge

Users should be able to:

• View the optimal layout for the interface depending on their device's screen size
• See hover and focus states for all interactive elements on the page
• Bonus: Use the local JSON data to dynamically populate the content

Screenshot

Links

• Solution: Frontend Mentor - Results summary component solution 🛠️
• Live Site: View Live Site 🌐✨

My process

What I learned

1. Handling API-like JSON Data: I explored using the Fetch API to retrieve and process JSON data dynamically.
2. JavaScript Promises and Async/Await: I improved my understanding of asynchronous JavaScript workflows and effectively handling returned promises.

Useful resources

• W3Schools: JavaScript Fetch API: A beginner-friendly guide to understanding the Fetch API.
• W3Schools: JavaScript Promises: Excellent explanation of promises and their usage.
• W3Schools: JavaScript Async/Await: A handy reference for simplifying asynchronous JavaScript.

Author

Created by Fortune Iyoha. 🌟 Connect with me on my Frontend Mentor profile or follow me on 𝕏 (formerly Twitter) for updates and web development discussions. 💬