Memory Game

I built this memory game using React.

The user stories which have been implemented are as follows:

The game must be able to:

• Notify the user if they win or lose
• Allow the user to reset at any time
• Randomize the ‘cards’ layout every game
• The game grid must be at least 6x6 cards

Bonus Stories

• Tracking time
• Tracking best time

Getting Started

Check out the live demo!

Click on any card to start the game (and the timer). The game ends when all of the pairs of matching cards are found. You can reset the game by clicking the Reset button and the cards will be reshuffled and the timer will be stopped until the game is started again.

Built With

• React.js
• create-react-app
• SCSS

Final Thoughts

I had a lot of fun building this project. I still have some lingering questions and/or improvements that I want to look in to, such as:

• Best practices for state management in React
• Tests
• More options to further improve the project including but is not limited to:
  • Multiplayer mode
  • Allowing the number of cards adjustable.

On a final note the game this project is not responsive, it is best viewed on larger screens.

Acknowledgements

• Wikipedia's article on the Fisher-Yates Shuffle was a great refresher on the algorithm