helenclx / Tenzies-Game

Roll until all dice are the same.

Tenzies Game

Roll until all dice are the same.

Play the game here: https://helenclx.github.io/Tenzies-Game/

Project Information

Built with Vite + React.

Based on the Tenzies game tutorial from Scrimba's Learn React course. However, I have made enhancements to the code to improve the app, including:

• Putting real dots on the dice using CSS
• Using relative units in CSS
• Making the app responsive to different screen sizes
• Adding dice roll count
• Recording the number of dice rolls and the time it took to win
• Tracking the best records of dice rolls and time taken to win
• Improved accessibility: the entire game can be interacted with key presses, along withvisible focus outlines

Running the Project Locally

1. Clone this repository locally

git clone https://github.com/helenclx/Tenzies-Game.git

2. Install dependencies

npm install

3. Run the project

npm run dev

4. Open http://localhost:5173/Tenzies-Game/ in your browser

Development Dependencies

• Font Awesome 6.5.1
• Google Fonts: Karla
• Nano ID
• React
• react-confetti

Credits:

• Scrimba's Learn React course - tutorial to create this game
• Flaticon - for the dice vector image that is used as the page's favicon
• Creating dice using CSS grid 🎲 by Edwin (@ekeijl on DEV Community)
• Create a custom React stopwatch timer component by w3collective - The time tracker feature of the game is based on this tutorial