set up

  • Setup the canvas
  • Setup game loop
  • Draw the ship
  • Move ship left
  • Move ship right
  • Thrust the ship
  • Shoot laser
  • Draw asteroids
  • Destroy asteroids
  • Detect collisions
  • Detect boundaries
  • Keep score
  • Game over

The first job is to set up the canvas.

<canvas id="gameCanvas" width="1280" height="720"></canvas>

//canvas setup
let canvas = document.getElementById("gameCanvas");
let context = canvas.getContext("2d");
	

blank canvas html html5 javascript game asteroids