Dytoma/rock-paper-scissors

Frontend Mentor - Rock, Paper, Scissors solution

This is a solution to the Rock, Paper, Scissors challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
• Author
• Acknowledgments

Overview

This is my solution to the paper, rock, scissors game and I'm quite happy with the result and will be improving it.

The challenge

Users should 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 (optional)
• Bonus: Play Rock, Paper, Scissors, Lizard, Spock against the computer (optional)

Screenshot

These are screenshot of some of the features of the website. You can view it all on live at [Rock-Paper-Scissors-Gme]

Links

• Solution URL: Solution URL here
• Live Site URL: Live site URL here

My process

I use Vite with react and it was pretty fun building this project, I learned a lot and Vite is a powerful tool when it comes to fast deployment and so on.

Built with

• Semantic HTML5 markup
• CSS custom properties
• Flexbox
• CSS Grid
• Mobile-first workflow
• Vite - JS library
• React reveal - React library

What I learned

I learned about the onLoad event.

<div onLoad={() => { game();}}></div>

Author

• Frontend Mentor - @Dytoma
• Twitter - @OmarDytoma