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 Using Vanilla JavaScript and Flexbox

P

@cdanderson76

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?

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.

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