Code Asteroids in JavaScript (1979 Atari game) – tutorial

In this JavaScript tutorial, you will learn to create the 1979 Atari game Asteroids from scratch using vanilla JavaScript.

⭐️Contents⭐️

⌨️1. (0:00) Spaceship creation

⌨️2. (33:55) Astroids creation

⌨️3. (58:40) Collision Detection and Explosions

⌨️4. (1:19:09) Shooting Lasers and Asteroid Destruction

⌨️5. (1:48:13) Levels, Lives, and Game Over

⌨️6. (2:10:10) Scoring and Saving Data Locally

⌨️7. (2:20:24) Sound Effects and “Music”

Tutorial from Mt. Ford Studios. Check out their channel for more great tutorials: https://www.youtube.com/channel/UCYGcMtRTLWQHgLq4V3bP3sA

Read hundreds of articles on programming: https://medium.freecodecamp.com

Original source

19 thoughts on “Code Asteroids in JavaScript (1979 Atari game) – tutorial”

• January 21, 2019 at 14:00

1:02:57 – Where has the code for // center dot gone??? Was I supposed to delete this at some point? : /

• January 21, 2019 at 14:00

Super tutorial and thanks for creating and uploading such great content! To be honest, at first i also had some problems with the trigonometry for drawing the ship. Here another variant which is easier to understand (at least for me). This method uses the respective radian measure for the alignment (two times PI equals 360 degrees of a complete circle in radian):

ctx.moveTo(
ship.x + (ship.r * Math.cos(ship.a)),
ship.y – (ship.r * Math.sin(ship.a))
);
ctx.lineTo(
ship.x + (ship.r * Math.cos(ship.a + ((3/4)*Math.PI))),
ship.y – (ship.r * Math.sin(ship.a + ((3/4)*Math.PI)))
);
ctx.lineTo(
ship.x + (ship.r * Math.cos(ship.a + ((1+(1/4))*Math.PI))),
ship.y – (ship.r * Math.sin(ship.a + ((1+(1/4))*Math.PI)))
);

For further infos simply google: "Trigonometry Unit circle".

• January 21, 2019 at 14:00

Super fun game, yup 😀 Pretty great time developing and playing it!

• January 21, 2019 at 14:00

awesome. I will be waiting for more like these from scratch vanilla JS projects.

• January 21, 2019 at 14:00

Its really amazing. If possible can you do a video or article explaining the math too?

• January 21, 2019 at 14:00