https://github.com/gonferreyra/rock-paper-scissors-game

Rock-Paper-Scissors Game
https://github.com/gonferreyra/rock-paper-scissors-game

react redux-toolkit tailwind typescript zustand

Last synced: 11 days ago
JSON representation

Rock-Paper-Scissors Game

• Host: GitHub
• URL: https://github.com/gonferreyra/rock-paper-scissors-game
• Owner: gonferreyra
• Created: 2024-08-20T14:08:33.000Z (3 months ago)
• Default Branch: main
• Last Pushed: 2024-08-28T13:17:02.000Z (3 months ago)
• Last Synced: 2024-10-11T11:44:32.889Z (about 1 month ago)
• Topics: react, redux-toolkit, tailwind, typescript, zustand
• Language: TypeScript
• Homepage: https://rock-paper-scissors-game-swart-beta.vercel.app
• Size: 654 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# ROCK, PAPER, SCISSORS GAME APP

This is a solution to the [Rock, Paper, Scissors challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/rock-paper-scissors-game-pTgwgvgH).

## Table of contents

- [ROCK, PAPER, SCISSORS GAME APP](#rock-paper-scissors-game-app)

  - [Table of contents](#table-of-contents)

  - [Overview](#overview)

    - [The challenge](#the-challenge)

    - [Screenshots](#screenshots)

    - [Mobile 375px](#mobile-375px)

    - [Mobile 430px](#mobile-430px)

    - [Laptop 15"](#laptop-15)

    - [Desktop WideScreen 1521px](#desktop-widescreen-1521px)

    - [Link](#link)

  - [My process](#my-process)

    - [Built with](#built-with)

    - [State](#state)

  - [Author](#author)

## Overview

### 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

### Screenshots

### Mobile 375px

![mobile](preview/iPhone%206-7-8-1724699240680.jpeg) \

### Mobile 430px

![mobile430](preview/iPhone%2014%20Pro%20Max-1724699096667.jpeg) \

### Laptop 15"

![laptop](preview/Laptop%2015"-1724699894185.jpeg) \

### Desktop WideScreen 1521px

![desktopWide](preview/Widescreen-1724699866771.jpeg)

### Link

- Live Site URL: [Here](https://rock-paper-scissors-game-swart-beta.vercel.app/)

## My process

### Built with

- [React](https://reactjs.org/) - JS library

- [Tailwind](https://tailwindcss.com/)

- Typescript

- Mobile-first workflow

### State

Global state is managed with ContextApi (v1), Redux (v2) and Zustand (v3). The 3 versions are managed in different branches, using the latest version (Zustand) in the main. The idea of ​​managing the states in 3 different ways is to practice how each one is managed

## Author

- Linkedin - [Gonzalo](https://www.linkedin.com/in/ferreyragonzalo/)