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

@Nahuel-cell

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


I would really appreciate if you could give me feedback on my little project. The most difficult part of this was when I wanted to select another classification and make the orange color of the number go to the new element that the user clicked on. I don't know if I explained myself but I appreciate that you comment on my mistakes or improvements. Just judge for yourself and then tell me.

Community feedback

P

@Eileenpk

Posted

Hi Nahuel-cell, your project looks good.

I would consider changing the let rating; to let rating = null

It is generally considered good practice to initialize a variable with a value, rather than declaring it without a value. If you are declaring a variable with a type "let" or "const" and you're going to assign it a value later, it's a good idea to initialize it with a default value, like null. This is because, if you don't initialize a variable and try to use it before assigning a value to it, it will throw a "ReferenceError: variable is not defined" error. By initializing a variable with a default value, you can avoid this issue and make your code more predictable. Additionally, if you are going to use a variable in an expression, it's a good idea to initialize it with a default value that is appropriate for the expression, such as an empty string or zero. So, it is considered a good practice to initialize a variable with a default value, such as null, when you are going to assign it a value later.

Hope you found this helpful!

Marked as helpful

1

@Nahuel-cell

Posted

@Eileenpk Thank you very much for your comment!. I'll keep it in mind

0
Dytoma 570

@Dytoma

Posted

Hey👋

Good job on completing this challenge👏

I have some feedback that you can use to improve your code:

  • First instead of using article elements, I will suggest you use div elements and give them a role attribute(eg: <div role="main">....</role>).
  • For the <div class="attribution">......</div> you can add a role="footer" you can learn more about landmarks here. And for <img src="./assets/images/illustration-thank-you.svg" alt="Illustration" class="article__illustration"> I will suggest you add an aria-hidden='true' attribute for screen readers to skip this image as it just serves for decoration.

Happy coding🙌

Marked as helpful

0

@Nahuel-cell

Posted

@Dytoma I didn't know about the landmarks, thank you very much!

0
Dytoma 570

@Dytoma

Posted

@Nahuel-cell You're welcome🙌

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