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

Animated Interactive Rating Component | Svelte TS + WindiCSS and Vite

#svelte#typescript#tailwind-css
Shawn Lee 560

@OGShawnLee

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


Hey! Shawn here. This is my very first solution. It took more time than expected since I had to figure out how to host it. Well I don't have much to say. I am pretty content with the result and extremely comfortable with the stack I chose: Svelte + Svelte Transition API + WindiCSS + TypeScript + Vite... Truly the joy of code. Only thing bothering me is semantic HTML and accessibility, any advice in that regard? Would love to get some feedback from you guys. Have a good one and thanks for reading/viewing!

Community feedback

Alex Li 380

@awexli

Posted

Hey Shawn, nice solution :-)

Instead of using span for the titles "How did we do?" and "Thank you!", it might be semantically better to use heading tags (<h1 />)

Beyond the code itself, one thing to think about is the user experience. For example, what should happen if a user clicks submit without selecting any options? Should there be some type of UI feedback letting the user know they must select at least one option? How would you represent that? Maybe a little message below? It's good to keep user experience in mind as a Frontend dev -- good luck on your journey!

Marked as helpful

0

Shawn Lee 560

@OGShawnLee

Posted

@awexli Hello Alex. Yes, I should have used headings and about the UX I actually thought of adding a third state that handled errors but I didn't add it at the end. I will commit those fixes soon. Thanks for replying! :)

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