Angular Rock Paper Scissors Game

Solution retrospective
I'm most proud of leveraging Angular’s latest features—particularly Standalone Components and Angular Signals—to build a clean, modular Rock, Paper, Scissors game that feels modern and responsive. The use of SCSS for custom styling and CSS animations for interactive effects (like the pulsing hover effect) really helped bring the design to life, and implementing LocalStorage for score persistence added a nice touch for user experience. Next time, I'd invest even more time in cross-browser testing (as I encountered some issues on Safari) and refine my state management approach to further simplify the code and boost performance. I’d also like to explore more robust accessibility features to ensure an inclusive user experience.
What challenges did you encounter, and how did you overcome them?One of the major challenges was achieving consistent hover effects across browsers, particularly on Safari, where CSS pseudo-elements and pointer events behaved differently. This led to some trial and error with various CSS workarounds to mimic the desired hover effect. Additionally, configuring Angular’s build process presented its own hurdles—especially around polyfills and asset paths—which required careful adjustments and community research to resolve. I also struggled to get the animation to start on its own without any user interaction, which added another layer of complexity. By methodically isolating issues and testing incrementally, I managed to overcome these obstacles, though they highlighted areas for potential improvement in future projects.
What specific areas of your project would you like help with?I'm looking for advice on optimizing the use of Angular Signals for state management—any best practices or patterns that could make the code even cleaner and more efficient would be valuable. Also, I’d welcome suggestions on performance, particularly on lower-end devices, to ensure the game is as smooth and inclusive as possible. Any insights or recommendations in these areas would be greatly appreciated.
Please log in to post a comment
Log in with GitHubCommunity feedback
No feedback yet. Be the first to give feedback on Daniel Cristea's solution.
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