I have made a simple game with react. Check it out and provide me with some precious feedback.
Here is the link:
4 Likes
Hey @sauravk7077!
I think this is a cool project!
The only thing that confused me were the rectangle matches. When I was playing the game and thought I found a match with another rectangle it wouldnât match. And then sometimes the rectangles would match. When I finished the game and looked at the complete board the rectangles all looked the same.
So I donât know why some match each other while others donât.
Other than that, great job!
Happy coding!
Can you explain me briefly about that? Werenât you confused with similar rectanges? I will try to fix it if it was a bug.
For example, these two donât match.
At first, I thought it was based on color and picture matches but when I finished the game I noticed they were all different colors but with the same rectangle.
I think those Unicode characters are not supported by your computer.
This is what it should look.
Oh ok that makes sense. Cause even when I look at your code the rectangles show up for me there too.
const numbersList = [
"đ„",
"đ",
"đ§š",
"đ",
"đ",
"đ",
"đ„œ",
"đ",
"âœ",
"đȘ"
];
I have changed them to font-awesome icons. Check it out now.
1 Like
Really cool.
Great job with your project!
Thanks for your feedback.
This is really nicely done. You even have little flipping sound effects. Maybe add an additional sound when you get a match?
Now I am going to challenge you with two things 
- Make this keyboard accessible.
- Make this a little more responsive to changes in text size.
As it stands, I canât use my keyboard to play this game at all. I think it would be a good challenge to make it completely keyboard accessible. Allow the user to use the arrows keys for navigation through the board. And I would suggest you make each of the container divâs a button, which will automatically give you keyboard accessibility for flipping.
The text size issue is maybe more of a minor issue but if you are a perfectionist like me If you donât know how to increase the text size, using Firefox, go to the View -> Tools menu and activate âZoom Text Onlyâ. Then while holding down the Ctrl key, scroll your middle mouse button to increase the text size. After you crank the size up a bit, flip something and youâll see the issue. I think this is a easy as allowing the circles to grow as the text size grows. But you may need to make some minor adjustments on other things as well.
Just thought of something else. Maybe you could allow the user to choose the size of grid to play on? Just throwing things out there to keep you busy
Very nice job.
1 Like
Thanks for the wonderful feedback. I humbly accept your challenge.
Wow, you have made a lot of progress on those challenges I gave you. Nice job.
1 Like
I have made some more changes, check it out.
1 Like
I see you added a selection of board size @sauravk7077 Problem is if I choose anything but 2x2 I get 3x2 or 4x2 or 5x2 not 3x3 or 4x4 of 5x5 like it says. Happy Coding! 
I donât think 3x3 is possible as 9 is an odd number.
It woud look like this ###
h vvvvvvvvvvvvvvvv ###
h vvvvvvvvvvvvvvvv ###
Only look at the # symbols
You could have an odd number of circles, youâd just need to make one of them intentionally empty. You could gray it out or something so that it isnât included in the flipping.
Another thing I just thought of. When you first display the grid to the user with the icons showing so that they have a few seconds to try and memorize things, you could display a countdown clock so they know how much time they have.
That would neither look nice nor match with the title of the game.
Actually, now that I think of it, for an odd number of circles you could pick one to be a âbombâ and if they accidentally choose it they automatically lose the game and have to start over.