Functional-Asteroids icon indicating copy to clipboard operation
Functional-Asteroids copied to clipboard

Rebuilt Asteroids with functional programming and Redux

Functional Asteroids

Overview

A rebuilt version of my Asteroids project, but this time with code that is functional instead of object oriented.

Asteroids is built using the following tools:

  • HTML canvas to draw the game
  • Redux to manage the game state
  • React to build all the UI that isn't in a canvas
  • Babel to transpile JS and JSX
  • Flow to add type checking
  • Webpack for module bundling
  • Aphrodite for styling in JS
  • Keymaster for key press handling
  • Lodash for utility functions
  • ESLint for linting

New features

This version has the same features as the previous version, plus some new ones.

  • The player has a limited number of bombs, which destroy every asteroid in the game.
  • Instead of increasing the score multiplier with a powerup, it is now increased by hitting asteroids in quick succession.
  • There are new powerups.
  • The gun powerup causes the ship to temporarily shoot a three-bullet spread. Previously it would make the bullets larger and faster.
  • The sound can be turned off.
  • When the game ends, a new one can begin without refreshing the page.

Running locally

  • Clone the repo
  • npm install
  • webpack
  • open index.html