Home

Project - Hangman Game

Guess the word - 8 incorrect guesses and you're out

Game screen for the Hangman game. The category is displayed at the top. In this case, the category is "Capitals." In the middle are boxes that are either filled in for guessed letters or left empty for unguessed letters. A keyboard is displayed at the bottom, with some letters grayed out.

How it works

We've all played Hangman before. You can choose from six different categories, including TV shows and capital cities. Then, you are presented with a word or multiple words that you must guess correctly.


Players may guess as many times as they like. However, after eight incorrect guesses, they are eliminated. When a correct letter is guessed, all occurrences of that letter in the target word are revealed. If a guess is incorrect, the respective letter button turns gray and becomes disabled.


During the game, you can quit or switch categories. Once the game is over, you can restart it with the same category. There are plenty of words to guess, so don't worry about the game becoming repetitive.


Technologies used

Mobile-first

React

CSS3

JSON

Responsive Design

What I've learned

This was one of the first projects I built with React. I learned a lot about state management and when to use useState. I also learned a lot about effects in React. Lastly, I improved my accessibility skills after completing this challenge.


Continued Development

In the future, I would like to work on achieving a perfect accessibility score for this project and refining the design.


Ask my AI assistant any question about me.