DEV Community

Discussion on: My New Spacecraft Browser Game with Vanilla JS

Collapse
 
dougmckechie profile image
Douglas McKechie

Nice. Looks good and plays well!

A few years back I really got in to making things with canvas, so it was interesting to take a look over the source code to see how you implemented it.

A few questions to kick off a bit of discussion...

  1. How did you learn the skills to make this game? Are there some particular tutorials that you took or books/articles read about canvas game development which myself or others here could benefit from reading/watching if we wanted to make a game like this?
  2. What aspects of the game were challenging to create, and what parts of the game were easier to implement than expected?
  3. Finally, any words of advice or tips or tricks you would like to share about creating browser games with JS?

I got in to software development because of games, and have loved playing with canvas in recent years. Nice to meet another person having fun with it.

Thanks for sharing.

Collapse
 
danialdezfouli profile image
Danial Dezfouli

Hey Douglas,

You can learn the basics of canvas here with Chris like I did it a few years before:
youtube.com/c/ChrisCourses/playlists

Doing basic 2d stuff with canvas is so easy and has a main loop to draw and update that you can do this with a setInterval or for smoother animations with a recursive requestAnimationFrame

I have used canvas for stars, and most elements are implemented via DOM, and if you don't use a library like gsap, it would be hard to implement non-linear effects.

if you want to create a real-world browser game, it would be better to use libraries(engines) like pixijs.com for better performance and also better developer experience; I don't do it because I want to improve my skills and have something challenging for a weekends

And finally, for me, it's interaction design and not just a game which I always follow codrops and awwwards.

tympanus.net/codrops/
awwwards.com/
greensock.com/gsap/
pixijs.com/

Best
Danial