Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted over 1 year ago

Interactive Rating Component Using Vanilla JavaScript and Flexbox

P
Clifford Anderson•200
@cdanderson76
A solution to the Interactive rating component challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


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

Not sure what I'd do differently next time. This was my first project implementing JavaScript, and I think I did ok. I did take the time to plan my approach on this project, as I was nervous about going into it and getting stuck. And while I DID get stuck, I learned a very valuable lesson about the developer tools in Chrome.

I can say that I'm most proud of the animations that I was able to include in this one. I just wanted to find a way to make this my own unique version. 'I' think it looks pretty cool :) .

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

GETTING THE VALUES FROM THE LIST OF ELEMENTS. I'm sure it was very easy for some, but everything that I had tried was amounting to errors and lots of repetitive 'undefined' alerts being thrown in my face. But then it occurred to me that maybe I should make sure that I'm grabbing the list elements the appropriate way in JavaScript. I opened my dev tools and 'console-logged' what I was grabbing. Once I got something back, I took a deeper look inside to see if I could find what I wanted, and I found the values that I was trying to get. After so many challenges and lessons with objects, it was smooth sailing from there. I also had to google search how to highlight one of the list elements while 'un-highlighting' any other selections. Did some digging in stack overflow and found what I was missing. AND, I actually could understand what the code was doing...

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

I think I got most of my answers that I had researched, but by all means, any productive input on how I can improve this is more than acceptable.

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Clifford Anderson's solution.

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

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner
  • Use cases

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License