Hangtree Game

A learning project focusing on using JavaScript to create a sliding menu and a modal that fades in/out. Uses a simple profile/portfolio page as a base. Based on a project from Brad Traversy's Vanilla JavaScript course.

Uses WordsAPI to request random words, obscuring API key by making request through a Heroku proxy server that contains the key as an environment variable.

Link to project

https://andrew-braun.github.io/hangtree-game/

Functionality

• Generates random word and displays spaces on page
• Takes keystroke input and checks for correct answer
• Adds letters to word on correct answer
• Adds strokes to SVG tree on wrong answer
• Detects win and loss conditions
• "Play Again" resets game to initial state

Concepts

• Game design
• SVG creation
• Helper functions
• Checking inputs
• API calls and key obfuscation

Technologies

• HTML5
• CSS3
• Vanilla JS
• Heroku

Planned Features

• Better tree
• Aesthetic overhaul (In progress)
• Make sure words are commonly-used/easy
• Add limited fallback dictionary in case random word API fails
• Separate js into different component files
• Random word API (Done!)
• Reveal word on defeat (Done!)
• Show word definition on game end (Done!)
• Better mobile experience (Mostly done)
• "Guesses left" counter (Done!)
• Animations (Added: popup)
• Play again responds to enter key press (Done!)
• Add loading animation (Done!)