Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Interactive rating component

roopxx 120

@roopxx

Desktop design screenshot for the Interactive rating component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I'm most proud of successfully implementing an interactive rating component that responds to user input and changes its state accordingly. I learned how to use the forEach method to loop through an array of button elements and add event listeners to each one. I also learned how to use classList to add and remove classes from elements. If I were to do this project again, I might explore other ways to handle user interaction, such as using different JavaScript methods or libraries.

What challenges did you encounter, and how did you overcome them?

One of the main challenges I encountered was designing the layout using flexbox and implementing a mobile-first workflow. To overcome this, I spent time studying flexbox and how to use it effectively. I also researched and practiced mobile-first design principles. This experience taught me a lot about responsive design and how to build interfaces that work well on a variety of screen sizes.

What specific areas of your project would you like help with?

I would like help with improving the user experience of the rating component. Specifically, I'm interested in feedback on how to make the rating selection more intuitive and satisfying for users. I'm also open to suggestions on how to improve the responsiveness of the design, especially for very small or very large screen sizes.

Community feedback

Please log in to post a comment

Log in with GitHub
Discord logo

Join 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