Rock, Paper, Scissors using React, CSS3

I appreciate your feedback @mattstuddert.

As a beginner, working with React was quite tough, but exciting nonetheless.

• I didn't know assigning e.currentTarget.id to userChoice.name will directly mutate the userChoice object in state, because I started off by cloning userChoice and houseChoice like so:

handlePick = (e) => {
    const userChoice = {...this.state.userChoice};
    const houseChoice = {...this.state.houseChoice};

    // Other code lines go here
}

Do I have to clone/setState for each key : value pair in this instance?

I've started learning about hooks, and definitely will apply them once I get the hang of it.

• On the identical components, I'll refactor my code as you suggested. I just noticed the same repetitive pattern in my Starter component too. I'll fix them.

Nice work, Solomon! How did you get on using React? Did you find it OK to work with? Overall, you've done a really good job. The game looks great and functions exactly as the brief outlined. There are a couple of small pointers I'd make after looking at your code:

• You're mutating assigning variables from state and then mutating those objects, which goes against React's typically paradigm of using immutable state. For example, in the handlePick method you've got lines like userChoice.name = e.currentTarget.id; whereas you could do setState({ userChoice: { name: e.currentTarget.id, ...this.state.userChoice } }). This would update the name property on the userChoice state object while also preserving the other property values. I'd also recommend reading up on hooks for doing this kind of logic in functional components. Hooks can really clean up the React code you write quite considerably.
• You've got 3 separate, but almost identical components for the Rock, Paper, and Scissors choices. This would be a perfect opportunity to refactor these into one single component that you can pass props into to change the choice between the 3 of them.

Keep up the great work and let me know if you have any questions 👍