Block Invaders

Date: 07/08/2022

By: Austin Taylor

Website | GitHub | LinkedIn

---

Hosted Site

Block Invaders

Version 1

Description

This is a multi-level, in-browser version of the classic arcade game Space Invaders. The user controls a block that can shoot and move left or right while the enemy descends toward the player. The user automatically moves to the next level if the player defeats all Invader blocks. As the level increments, the speed of the invaders' descension and the bullet travel speed increase while the shooting cooldown time decreases.

Technologies Used

• HTML
• CSS
• TypeScript

Basic Javascript Concepts:

Arrays

• .filter()
• .forEach()

Loops

• for
• while
• classList.remove()
• classList.add()
• setInterval()
• clearInterval()
• setTimeout()

Getting Started

• Use Left Arrow Key or A Key to move left.
• Use Right Arrow Key or D Key to move right.
• Use Up Arrow Key, Spacebar, or W Key to shoot.

Known Bugs

• If player shoots too fast, the "bullet" class gets stuck on the div until the player fires in the same column. Implemented a bullet cooldown as a fix.

Screen Shots

Landing Page

Gameplay

Shooting

Next Level

Sources

Ania Kubow's Space Invaders served as inspiration by using an array to place the invaders and using classList.remove() and classList.add() to "move" elements.

Trello Board

Block Invaders Trello Board

Future Features

1. add Hall Of Fame leaderboard
2. make mobile friendly
3. different themes

License

MIT License

Copyright © 2022 Austin Taylor