This was a fun little coding challenge. I recreated the classic Tetris game using React.js and hosted it on my Google Cloud in a container.
This was a great project to work on because it used a variety of skills: Javascript, HTML5, CSS3, React.js and a few other things to get everything up and running online.
Tetris is a classic game known around the world so there isn't too much we did here. The tetrominos were coded from scratch even the shading was applying using a matrix for each type of tetromino.
 |
| DIY React.js Tetris |
As an additional challenge we had to be able to flip the tetrominos left and right as well as drop them instantly. I had to code around this so that the tetrominos did not overlap each other or the edges of the viewing pane. And finally we had to add in game logic where the game ends when the tetrominos go above the top, we clear rows when they are full of blocks, and if you've gotten this far you've probably played Tetris so I don't have to say more.
 |
| An end game shot of our DIY React.js Tetris |
No comments:
Post a Comment