Dice Game

Welcome to the Dice Game project! This is a simple React application where you can roll dice and have fun. The project uses React Hooks (specifically useState), styled-components for styling, and Props to create variant components.

Features

• Roll dice and see the outcome.
• Enjoy a visually appealing display of the dice with animations.
• Customize the appearance of the dice using styled-components.
• Explore the flexibility of component variants using Props.
• Learn how to play the game with the provided rules.

Technologies Used

• React.js
• useState Hook
• styled-components
• Props
• html5
• css3
• javacsript

Rules Component

Deployment Link:

https://react-dice-game-git-main-waqasarshad97s-projects.vercel.app/

How to Play Dice Game

The Rules component provides instructions on how to play the dice game. Here's a breakdown of the rules:

1. Select any number: Choose a number you think the dice will land on.

2. Click on dice image: Click on the dice image to roll the dice.

3. Guess correctly: If your selected number matches the dice number, you'll earn points equal to the dice number.

4. Wrong guess penalty: If your guess is incorrect, points will be deducted equal to the dice number.

Styling

The Rules component is styled using styled-components. It features a light pink background, padding, and maximum width/height for a clean presentation.

To run this Weather Cast app locally, follow these steps:

1. Clone the repository. URL : https://github.com/WaqasArshad97/DiceGame
2. Navigate to the project directory.
3. Install dependencies: npm install.
4. Start the development server: npm run dev.

Video Tutorial is here :

lv_0_20231203234159.mp4