Interactive Rating Component

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

I’m most proud of creating an interactive rating component that is both user-friendly and visually appealing. The component responds smoothly to user input, providing immediate feedback when a user hovers or clicks on a star or rating icon. It is also accessible, supporting keyboard navigation and screen readers. Additionally, the component’s state management is efficient and easy to extend, making it reusable in different parts of the application.

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

One of the key challenges was implementing the logic to accurately display the selected stars on the screen as the user interacted with the component. It was tricky to keep the UI in sync with the user’s input—making sure that when a star was clicked, the correct number of stars would remain highlighted, and also updating the display immediately on hover without overriding the selected rating.

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

Accessibility improvements: Although I implemented basic keyboard navigation and ARIA attributes, I’m not fully confident that the component meets all accessibility standards. Any advice on how to improve screen reader support or keyboard interactions would be very valuable.