A basic Tetris app built using HTML, CSS, and JavaScipt based on the tutorial taught by Ania Kubow. Like the well-known puzzle game, Tetris, this app will have the same/similar functionality as its namesake. As a kid (and an adult) I was a huge fan of playing the game so this has been an ideal project for me to work on as I continue to study front-end web development.
A live version of the game can be viewed here. The app is mostly functional with a few minor glitches I still haven't worked out.
In particular, if a vertical-like Tetromino (e.g., the I or L shaped Tetromino) falls down on the far left side of the grid it will go past the bottom edge instead of stopping. This image below displays what I mean. If you know how to solve this problem or would like to help, I am very open to mentorship and collaboration. Feel free to contact me via email or visit the GitHub issue I created for this glitch. Thank you.
My updates for this project can be found in the following #100DaysOfCode Entries:
- September 03, 2022: Started working on the Tetris app
- September 04, 2022: Added functions for
freeze(),moveLeft(), andmoveRight() - September 05, 2022: Updated
freeze()function, organizeddivboxes, and createddisplayShape()function - September 06, 2022: Attempted (but failed) to fix deprecated code in the
control()function, UpdateddisplayShape()function - September 07, 2022: Added functionality to the
Start/Pausebutton - September 08, 2022: Completed the tutorial and the app works!
- September 12, 2022: Removed deprecated code from
control()function - September 13, 2022: Added some colors and styled the page
You can also get updates on my progress for this project and others by following me on Twitter, Hashnode, or GitHub.
This project was created under the MIT License with permission from Ania Kubow. (Thanks Ania!) Here is the link to the original GitHub repo by Ania Kubow.