This is my sixth project for the Front End Web Development Techdegree at Treehouse.
A word guessing game with 5 lives. The Harry Potter world was used as a theme.
Users should be able to:
- Click on a start button to remove a start overlay.
- Click on a letter on the HTML keyboard to reveal a letter of the phrase.
- If a clicked keyboard letter is not in the phrase, a life is lost.
- If the user guesses the phrase, a winning overlay appears.
- If all lives are used up, a losing overlay appears.
- Exceeds: Transitions have been added to the phrase display.
- Exceeds: A button has been added to the “lose” and “win” overlays to reset the game
- Live Site URL: Project 6 Harry Potter Themed Game Show App
- CSS
- JavaScript
I learned a lot of javascript doing this project:
- DOM Manipulation
- How to create an array of objects.
- How to create elements and insert them into the DOM.
- How to pass a function with data to another function.
- Event Listeners.
- Using the Console for Errors
I did find this project daunting, as it was the first time adding epic multiple lines of javascript to a project. 🙃
However, the more lines of javascript I created that worked, the more excited I felt about javascript and part of the excitement was finally using javascript creatively. It was even fun using the console to understand my errors.
In the future I would like to add:
- Audio, as in some Harry Potter music for different events.
- Add some media queries and start with a mobile-first approach.
- Possibly some animation with javascript.
- How to get Last Element of an Array in Javascript? - This helped me understand how to get the last element in an array when you don't know how many items are in an array.
- Team Treehouse - samanthaatkinson
- Twitter - @sammodeste1
- LinkedIn - sam-atkinson-modeste
- GitHub - SamAtkinsonModeste
- Brian Jensen our Student Success Lead
He gave me a lot of support and helped me find my confidence with Javascript.