Skip to main content

RPS in React

In this lab, we'll re-create the Rock Paper Scissors game we built using Vanilla JS in React. We will be reusing the game logic class we built for the RPS game.

Learning outcomes​

  1. Convert a web application/game built with Vanilla JS to use React.
  2. Demonstrate understanding of the SOLID principle (Single Responsibility) by separating the game logic from the game controller.

Background​

React​

React is a JavaScript library for building user interfaces. It is maintained by Meta/Facebook and a community of individual developers and companies. React can be used as a base in the development of single-page or mobile applications. However, React is only concerned with rendering data to the DOM, and so creating React applications usually requires the use of additional libraries for state management and routing.

Guidelines​

  • Make a habit of committing and pusing your code frequently to github.
  • Make sure to meanignful commit messages that describe what you did.
  • Don't forget to fill out the self assessment on the README file, and the feedback form at the end of the instructions.

Extra Credit Opportunities​

  1. Reset Game Button (3 points - Required for teams more than 2)
  • User can Reset the game and Type in a new player name (3 points)