Interactive Rating Components build using React
Design comparison
Solution retrospective
This is my first Reactjs application. If you have any suggestions on what I should change and make my code clean and reusable. I had some difficulty figuring out what code to put in what file.
Community feedback
- @catherineisonlinePosted almost 2 years ago
Hello 🙌🏻 Your solution looks great however here are a couple of things you can improve which I hope will be helpful! 😎
Instead of using buttons with number text, I would use radio buttons instead because buttons are supposed to lead into some actions, it's not their purpose to save their values.
Make sure to use rem (relative length value) or em units instead of pixels for the purpose of “respecting the user preferences”, to say so. It makes the “sizes” of the website fluid according to the zoom/sizes set by the user.
You can read more about it here: https://www.freecodecamp.org/news/what-is-rem-in-css/
Also, make sure to wrap the entire code in the main tag instead of using the div, the one where the class is “root”. It will help to remove report issues and improve accessibility as well. If you are using, for example, header or footer tags, you can place them outside the main tag.
Marked as helpful1@Blurryface1998Posted almost 2 years agoHello @catherineisonline, Thank you for leaving a comment and helping me 😄 ,
- I'll change my Buttons to radio buttons!
- I used pixels for testing purposes but I forgot to change them to rem before uploading my project...😢
- I'll change the div id root to main.
0@catherineisonlinePosted almost 2 years ago@Blurryface1998 Glad it helps
0
Please log in to post a comment
Log in with GitHubJoin 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