Nostalgia time! Paratrooper is one of the first video games I ever played, somewhere back in the late 80'ies on my first computer (an 8086). It was made in 1982 and is pretty simple: you are a turret in a fixed position and need to shoot down helicopters and paratroopers. If on either side four troopers manage to land it's game over, because they will be able to climb up the turret and blow you up. Shooting down stuff earns you points, but each bullet costs a point. Great!

I was reminded to this game because I needed a little side project to get a better feel for TypeScript and I wanted to do something with <canvas>. Oh and I wanted to have little fun. And I know it was fun because around 2000, when Flash was the hottest and coolest thing on the web, I already rebuilt this game once in Flash. Unfortunately, it was before the days of Github and that code got lost. I searched old hard drives and backups but was unable to find it.

So I decided to build a new version in Javascript / HTML5. The code is on Github and the game is playable on Netlify. Note: it's desktop only and you'll need an ES6 capable browser.

TypeScript
I only used Vanilla JS + TypeScript, no frameworks or helper libraries. The only runtime dependency is firebase which I used to store the highscores in a nosql database (yes, I know this implementation is prone to abuse but I don't care, it's just a game ;). TypeScript really makes you write more reliable, predictable and robust javascript code and I'm happy to see it being adopted by more and more projects. Gatsby, for example, now has native support for TypeScript in core (using a plugin).

This was my first TypeScript project, so I'm sure I'm only scratching the surface. For now, I only just used it for type definitions, return types, and parameter properties to simplify my classes. But I really want to check out TypeScript decorators and more specifically, use them for Dependency Injection. For now, I rolled my own simple DIC which works out pretty well.

I did have some issues importing other modules with TypeScript, until I understood not all modules are compatible with typescript (and how you can workaround that).

There is a (very) small chance a trooper won't open his chute at all...

Fun
Although it still lacks some elements from the original (see the README), the game is perfectly playable at this stage. Coding the helicopter "explosion" was very satisfying, which basically takes each element the chopper is made of, and lets it fall in a spin. Some randomness makes sure each explosion is unique. I still need to do the same for a trooper, but at this point I probably already spent way too much time on this thing. It doesn't matter though, because it was fun. By the way, no SVG elements or other elements were used, everything is drawn in code on canvas.

Anyway, go ahead and set a highscore!