Rock Paper Scissors

typescript logo next js logo redux logo

a picture of project landing page

Rock Paper Scissors game built for the Mintbean.io August 2021 Hiring Hackathon

The user is up against the evil Computer-san, worshiper of RNGesus with the goal of wining a rock paper scissors match. Avoid the rick-roll and good luck!


Website shop page

One bug I had which prompted switching to redux, occurred when setting up the logic to determine Computer-San's move. The original implementation used a useEffect and useState hook to trigger the selection logic and set the state to use in the win/loss function. This worked fine during the initial set up but ran into issues when linking up to the parent component state where it triggered multiple renders and several infinite loops.

I attempted to nail it down and get a single render and set state however, I ended up wasting a day attempting to nail it down by attempting to move the logic into parent components and trying to trigger it with the logic that set the playerMove state. Unfortunately the bug persisted and would have taken me more time to solve than I had available and my state was getting complex anyway which is when I reached for Redux and Redux Toolkit. This decision completely eliminated both issues and allowed me to cut down significantly on duplicate code and prop drilling in the game itself and resulted in a more stable experience overall.

This change allowed me to complete my stretch goals as well and turn the game into a progressive web app to take and enjoy on the go and earned the Mintbean Star Award!

github repo