Skip to content

Latest commit

 

History

History
81 lines (61 loc) · 2.19 KB

README.md

File metadata and controls

81 lines (61 loc) · 2.19 KB

🪨 Rock Paper Scissors Game 🎮

A fun and interactive Rock-Paper-Scissors game built using Next.js 13 (App Router), TypeScript, and Tailwind CSS. Test your luck against the computer and see who wins! 🚀

🛠️ Tech Stack

  • Next.js 13 (App Router)
  • React
  • TypeScript
  • Tailwind CSS
  • ShadCN/UI Components
  • Lucide Icons

🚀 Features

  • Real-Time Gameplay: Make your move and see immediate results.
  • Dynamic Scoreboard: Tracks wins, losses, and ties.
  • Responsive UI: Built with Tailwind CSS for a seamless experience across devices.
  • Clean & Minimal Design: Powered by ShadCN and Lucide Icons for a sleek interface.

🏁 Getting Started

Follow these steps to get the project up and running locally:

  1. Clone the Repository
git clone https://github.com/AmruthLP12/rock-paper-scissors.git

cd rock-paper-scissors
  1. Install Dependencies
npm install
  1. Run the Development Server
npm run dev

Open your browser and navigate to http://localhost:3000 to play the game!

📁 Project Structure


📦 rock-paper-scissors-game
├── 📂 app
│   ├── 📂 components
│   │   └── ui
│   │       └── card.tsx
│   └── 📄 page.tsx
├── 📂 public
├── 📂 styles
│   └── globals.css
├── 📄 next.config.mjs
└── 📄 tsconfig.json

🎨 UI Components

  • Card Component: Customizable card layout using ShadCN UI.
  • Icons: Handled using Lucide Icons for rock, paper, and scissors representations.

📝 How to Play

  1. Choose your move by clicking one of the three buttons: Rock, Paper, or Scissors.
  2. The computer will randomly select its move.
  3. The game will display the winner and update the scoreboard.

🤝 Contributing

Contributions are welcome! Feel free to open an issue or submit a pull request for any improvements or new features.

📜 License

This project is licensed under the MIT License. See the LICENSE file for more details.

🌟 Acknowledgments

Next.js for the powerful framework. Tailwind CSS for the flexible styling. Lucide Icons for the clean and sharp icons.

💬 Feedback

Feel free to reach out via LinkedIn or open an issue if you have any suggestions or questions!