https://github.com/darshanas17/react-match-game
https://github.com/darshanas17/react-match-game
Last synced: 24 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/darshanas17/react-match-game
- Owner: Darshanas17
- Created: 2025-04-13T12:42:30.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-04-13T12:49:46.000Z (about 1 year ago)
- Last Synced: 2025-04-13T13:36:26.907Z (about 1 year ago)
- Language: JavaScript
- Size: 0 Bytes
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🎮 React Match Game
## 🚀 Live Demo
[Click here to view the demo](https://Darshanas17.github.io/react-match-game/)
### 📸 Preview/Responsive Design
- **Extra Small (Size < 576px) and Small (Size >= 576px)**:
- **Medium (Size >= 768px), Large (Size >= 992px), and Extra Large (Size >= 1200px)**:
- **Scorecard**:
## 📌 Overview
The **React Match Game** is a fun and engaging game where players need to match pairs of images. Players are challenged to match the images in as few moves as possible while tracking their score.
## ✨ Features
- **Matching Pairs:** The main gameplay revolves around matching pairs of images within a set time.
- **Score Tracking:** Keep track of your score based on the number of moves taken to match all pairs.
- **Timer:** A countdown timer adds to the challenge of completing the game in time.
- **Responsive Design:** The game adjusts perfectly across various screen sizes, making it easy to play on both desktop and mobile devices.
## 🛠️ Tech Stack
- **React.js** – Frontend UI
- **CSS** – Styling and animations
- **React Hooks** – For managing state and logic
## ⚙️ Installation & Setup
1. **Clone the Repository**
```bash
git clone https://github.com/Darshanas17/react-match-game.git
cd react-match-game
```
2. **Install Dependencies**
```bash
npm install
```
3. **Run the Application**
```bash
npm start
```
4. Open the browser and visit `http://localhost:3000/` to play the game.
## 🧩 Components Structure
- **MatchGame** – The main game component that handles game logic and rendering the game grid.
- **ScoreCard** – Displays the player's score and game stats.
## 🎨 Design & Assets
- **Font:** **Roboto**
- **Colors:**
- `#ff7f50` (Accent)
- `#ffffff` (Background)
- `#333333` (Text)
- Images used in the game can be accessed from various sources.
## 👨💻 Author
**Darshan A S**
- [LinkedIn](https://www.linkedin.com/in/darshan-a-s/)
- [Portfolio](https://darshanas17.github.io/darshan-as-17-portfolio/)
## 📜 License
This project is licensed under the **MIT License**.