/RPS

Rock, Paper, Scissors game made with Gatsby.

Primary LanguageJavaScriptBSD Zero Clause License0BSD

Rock, Paper, Scissors

Rock, Paper, Scissors game made with Gatsby for a challenge by Frontend Mentor.

Design preview for the Rock, Paper, Scissors coding challenge

Demo

Check out the demo! - https://rpsls-app.netlify.app/

Technologies

  • Gatsby: 2.23.12,
  • React v16.12.0
  • React Hooks
  • Framer Motion
  • Styled Components
  • Local Storage
  • Husky & lint-staged

Features

Users are be able to:

  • View the optimal layout for the game depending on their device's screen size
  • Play Rock, Paper, Scissors against the computer
  • Maintain the state of the score after refreshing the browser
  • Play Rock, Paper, Scissors, Lizard, Spock against the computer

Rules

If the player wins, they gain 1 point. If the computer wins, the player loses one point.

Original (Rock, Paper, Scissors)

  • Paper beats Rock
  • Rock beats Scissors
  • Scissors beats Paper

Advanced (Rock, Paper, Scissors, Lizard, Spock)

  • Scissors beats Paper
  • Paper beats Rock
  • Rock beats Lizard
  • Lizard beats Spock
  • Spock beats Scissors
  • Scissors beats Lizard
  • Paper beats Spock
  • Rock beats Scissors
  • Lizard beats Paper
  • Spock beats Rock

Not sure what Rock, Paper, Scissors, Lizard, Spock is? Check out this clip from The Big Bang Theory.

Credits and sources

This is a challenge by www.frontendmentor.io. I got all of the icons and designs from the website. I tried my best to get as close as possible to the designs.