All solutions

I worked on this mini-project with my understanding of ReactJS and the most common hook - useState. Managing state was a bit of a challenge (I created Global state), but my next topic of learning is useContext. Putting to practice what I am learning on React is quite the learning curve - but also encouraging to see my progress.

I started learning ReactJS about a month ago, so this is my first project using it. In this project, I made use of the useState and useEffect hooks. One of the challenges I faced when creating this project: I wanted to add the Category and Icons on the first render (whilst the initial scores remained 0), so that when a user clicked the button, it fetched the scores from the JSON file and rendered them on the page.

does anyone have any idea of how this could work?

PS: I wasnt able to crack it so I simply showed everything on the first render. What am I missing here?

Thanks in advance :)

After a hiatus of sorts from code, I decided to plunge in and do the challenges to ease my way back in. IT made me realize I had gaps in my understanding of Flexbox (especially properties of the children - like I needed to make sure the results and summary sections were of the same height after using flex - couldn't find a way to do that with flexbox, so I padded some padding till it appeared 'visually correct' which pretty much felt like 'forcing' the code, so I'll need to read up a little more on that. I'd appreciate some insight on this too for anyone who's found a concise way to work around it:)

I intend to repeat this challenge with ReactJS just to hone my skills and build projects as I am learning React presently.

Thanks in advance :)

I am curious about an aspect of Semantic HTML Markup - in my code, I had used the generic <section> tag for the testimonials and grid images, but this showed up on the accessibility report. I thought <article> tag would be a better option but it still showed up on the accessibility report.

What is the more preferred/accessible option for this? (using HTML/CSS/Vanilla JS). Thanks!