Rock Paper Scissors game (plus Spock & Lizard) - Frontend Mentor's Challenge

This project is a solution for Frontend Mentor's challenge.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • Personal notes
• Author

Overview

This challenge is to build out Rock, Paper, Scissors game and get it looking as close to the design as possible.

The challenge

In this project, users will be able to:

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

Screenshot

Links

• Solution URL: Frontend Mentor Solution Page
• Live Site URL: Rock Paper Scissor Spock Lizard Game

My process

Built with

• React js
• SCSS
• Localstorage
• Flexbox
• CSS Grid

Personal notes

There is some responsiveness issue when the page being view with desktop screen (> 1400px width), the layout isn't vertically centered enough. So I'd like to improve those in the future using ways such as flex column.

Author

• Website - Kiflan Adli
• Frontend Mentor - @kiflanadli