Logo
screenshot of hangman game

Hangman Game

next.jsreactstorybooktailwindcsstypescript

Introduction

This project is a modern take on the classic Hangman game, designed to test your vocabulary under pressure. Developed as part of my journey through Frontend Mentor challenges, it showcases my ability to transform concepts into interactive web experiences.

Requirements

Users should be able to:

  • Learn how to play Hangman from the main menu.
  • Start a game and choose a category.
  • Play Hangman with a random word selected from that category.
  • See their current health decrease based on incorrect letter guesses.
  • Win the game if they complete the whole word.
  • Lose the game if they make eight wrong guesses.
  • Pause the game and choose to continue, pick a new category, or quit.
  • View the optimal layout for the interface depending on their device's screen size.
  • See hover and focus states for all interactive elements on the page.
  • Navigate the entire game only using their keyboard.

Built with

Code Quality with

Implementation time

This challenge was completed over a span of 12 hours.