JavaScript Unscramble Project
For my Phase 4 project I chose to create an Unscramble game. The game is played by one user at a time. The user has 45 seconds to create as many words from the 20 letters given to them. To avoid any cheating, the input box does not appear until the game begins/the timer starts running. At the top of the game there is a navbar with a couple options — a description of the game rules, the games overrall highest score, and a search functionality that allows a user to search their or someone else’s highest score. To demonstrate what the page for the game looks like, I attached a screenshot below:
This project was significantly different than the previous projects throughout this program. Working the backend and frontend together was definitely something new for me, since before I did not have to constantly fetch information from the backend to display in the front end. Which was challenging but also very interesting. It felt like I was really starting to program (at least in a personal sense). Having the two ends working together makes the application, website, or game more complete in my opinion.
My favorite part of the project (surprisingly) was the ability to edit the color, size, height, and margins of the divs I created on the page. While this is not the most difficult aspect of the project, it just felt good to be able to style the page more personally and with more control. I will admit, I will have to get better at the color combinations I choose. Playing around with the background-color for the divs or paragraphs and margin sizes was something that I found enjoyable. What got a little more complicated was making susre the widths were correct, since it is difficult to tell sometimes if they are truly centralized.
Truthfully, this project was also particularly difficult because I had never built anything similar to this before (a game). So it was difficult at first to figure out what to do and how to go about creating certain functions of the game. Although looking back, I really do embrace the challenge and am currently content with my choice. The most difficult aspect of it was building the static function startGame in my game.js file. The function was complicated because I had to target many elements just to get the game to start while making certain divs, input boxes and text areas disappear when the game started. Which got tricky at some points because there was at times a lot of code going on at once. Just like the startGame function; the gameOver function was also challenging. Simply because there was a lot of different functionalities that it had — validate the words using an API, calculate the score, save it to the username, and then last but not least end the game.
