Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

🎮 A fun and interactive Hangman word-guessing game built using React, TypeScript, and Vite. Guess the word before the hangman is fully drawn — features on-screen and keyboard input, responsive design, and instant restart!

NotificationsYou must be signed in to change notification settings

samirzjadhav/hangman-typescript

Repository files navigation

ViteReactTypeScriptLicenseStatus

A fun and interactiveHangman word-guessing game built usingReact,TypeScript, andVite 🎯
Guess the hidden word before the hangman is fully drawn!


🎮 Demo


✨ Features

  • ⚛️ Built withReact + TypeScript + Vite
  • 🎨 Clean UI withCSS Modules
  • 🧩 Random word generator fromwordList.json
  • 🎹 On-screen keyboard + real keyboard support
  • 💀 Lose after 6 incorrect guesses
  • 🔁 PressEnter to restart instantly
  • 📱 Fully responsive design

🧠 How to Play

  1. Try to guess the word by clicking or typing letters.
  2. Every wrong guess adds a piece to the hangman.
  3. You have6 chances before the game is over!
  4. PressEnter to play again.

##⚙️ Installation```bash# Clone the repogit clone https://github.com/your-username/hangman.gitcd hangman# Install dependenciesnpm install# Run the appnpm run dev```

Then open 👉http://localhost:5173


🗂️ Project Structure

hangman/├── src/│   ├── components/│   │   ├── HangmanDrawing.tsx│   │   ├── HangmanWord.tsx│   │   └── Keyboard.tsx│   ├── wordList.json│   ├── App.tsx│   ├── main.tsx│   └── App.css├── public/├── tsconfig.app.json├── package.json└── vite.config.ts

🧩 Example Word List

wordList.json

["apple","banana","grape","cherry","orange","mango"]

🚀 Technologies Used

TechnologyDescription
⚛️ReactUI component library
🧠TypeScriptType-safe JavaScript
ViteFast build tool and dev server
🎨CSS ModulesScoped component styling
📝JSONFor storing word lists

💡 Future Improvements

  • 🌍 Add multiple word categories (Animals, Movies, Countries)
  • 🎯 Add difficulty levels (Easy / Medium / Hard)
  • 🔊 Add sound effects and score tracking
  • 💫 Animate hangman drawing step-by-step
  • 🧠 Add hints system

🤝 Contributing

Contributions are welcome!

  1. 🍴 Fork the repo
  2. 🌿 Create a new branch (feature/amazing-feature)
  3. 💬 Commit your changes
  4. 🚀 Open a Pull Request

📜 License

This project is licensed under theMIT License.You are free to use, modify, and distribute it.


👨‍💻 Author

👋 Samir Jadhaw💻 Aspiring Front-End Engineer passionate about building delightful web experiences.

🌐Portfolio💼LinkedIn🐙GitHub


⭐ If you like this project, don’t forget tostar the repo and share it!


About

🎮 A fun and interactive Hangman word-guessing game built using React, TypeScript, and Vite. Guess the word before the hangman is fully drawn — features on-screen and keyboard input, responsive design, and instant restart!

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

[8]ページ先頭

©2009-2025 Movatter.jp