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

6th Task: Interactive Rating Component ๐Ÿ™Œ๐Ÿ™Œ

Rodrigoโ€ข 480

@RodrigoHLC

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


My first Javascript/React project on this website after having completed the "Front End Development Libraries Certification" unit on freeCodeCamp.org. By this point, the HTML/CSS aspect is a breeze๐Ÿ˜Œthe layout for the initial state took about 1:15 h to complete. I also feel pretty comfortable working with React, as I already had to complete 5 projects to earn the fCC certification. Finding out how to make a rating button remain highlighted after clicking was challenging, though๐Ÿ˜“ And making the ratings button deselect after having clicked on a different button was hell๐Ÿ˜ต Still, I pulled through and I'm pretty happy with how it turned out. I also had to learn how to export from Codepen and make sure everything's properly formatted beforehand.

Community feedback

Rodrigoโ€ข 480

@RodrigoHLC

Posted

Welp, I didn't want to look at anybody's code before giving this one a try, so I'm just now learning about the :focus pseudo-state, lol. Would have come in really handy, but at least I got some more practice with React state changes and conditional rendering, so no complaints.

0

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