Max Roper
Challenges

Test Result Summary

30th April 2023
  • React
  • Sass

Displays a visual summary of a user's test results within a larger app.

Screenshot of challenge solution

Challenge requirements

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

This is my first challenge in React after doing a few beginner courses and I’m really enjoying the experience of putting together small apps using React and thinking in components.

I have done a lot with state and a little bit with useEffect so my usage might not be best practice here, however I am currently doing courses which are getting into more intermediate & advanced topics.

I tried to style the components with their own individual .scss files but it was a nightmare when trying to use global SCSS variables. Will revisit this in future as I haven’t started journeying into best ways of styling React components.