https://github.com/codehunt101/pokemon-matching-cards-project-phase-2
A fun to play memory card game app.
https://github.com/codehunt101/pokemon-matching-cards-project-phase-2
bootstrap css html javascript react typescript
Last synced: 3 months ago
JSON representation
A fun to play memory card game app.
- Host: GitHub
- URL: https://github.com/codehunt101/pokemon-matching-cards-project-phase-2
- Owner: CodeHunt101
- Created: 2021-08-01T05:41:27.000Z (almost 5 years ago)
- Default Branch: main
- Last Pushed: 2025-02-09T08:36:37.000Z (over 1 year ago)
- Last Synced: 2025-03-25T06:32:11.890Z (about 1 year ago)
- Topics: bootstrap, css, html, javascript, react, typescript
- Language: TypeScript
- Homepage: https://codehunt101.github.io/pokemon-matching-cards-project-phase-2/
- Size: 8.05 MB
- Stars: 4
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Pokémon Matching Cards Game
My first ever React project!
A fun and interactive Pokémon-themed matching cards game built with React, JavaScript/TypeScript, and Bootstrap/CSS.
## Features
* **Deck of Pokémon cards**: A randomly generated deck of Pokémon cards, each with a unique image and ID.
* **Matching game**: Players can flip over two cards at a time to try and find a match.
* **Game statistics**: The game keeps track of the number of moves made by the player.
* **Difficulty levels**: Players can choose from three difficulty levels: Easy, Medium, and Hard.
* **Reviews system**: Players can submit reviews of the game, including a rating and comments.
* **Responsive design**: The game is fully responsive and can be played on desktop, tablet, or mobile devices.
## How to Play
1. Start the game by clicking on the "Play" button.
2. Choose a difficulty level: Easy, Medium, or Hard.
3. Flip over two cards at a time by clicking on them.
4. If the cards match, they will stay flipped over. If they don't match, they will flip back over.
5. Keep flipping cards until all the pairs have been found.
6. Submit a review of the game, including a rating and comments.
## Installation
To install the game, follow these steps:
1. Clone the repository using Git: `git clone https://github.com/your-username/pokemon-matching-cards-game.git`
2. Install the dependencies using npm: `npm install`
3. Start the game using npm: `npm start`
## Testing
This project uses Vitest along with React Testing Library to ensure that the game functions as expected. Tests cover key aspects such as:
- **Component Rendering**: Ensuring that all React components render correctly.
- **Game Mechanics**: Verifying the card flipping and matching logic.
- **Game Statistics**: Tracking move counts and validating difficulty settings.
- **Review System**: Testing review submissions and data handling.
To run the tests, execute the following command: `npm run test`
## Acknowledgments
* **Pokémon API**: The Pokémon API used in this game is provided by [PokéAPI](https://pokeapi.co/).
* **React Bootstrap**: The React Bootstrap library used in this game is provided by [React Bootstrap](https://react-bootstrap.github.io/).