Basic Snake - Vanilla JS

I’ve been getting curious about what rudimentary game development might look like in the javascript ecosystem, so I challenged myself to dip my toes into that world by making a few iterations of a well known classic — Snake.

Granted this first one isn’t great for many reasons, when researching how others have done this before it seems that using the canvas in javascript is the way to go. Having spent about 4-6 months on a React game relying heavily on canvas (a paper doll dress up game of sorts… still to be finished! (someday)), I wanted to try something different. I went with just manipulating a css grid. Instead of indicating where the assets are with images or with a change of bg color, I just used text and as a result of the styling choices it’s not very visually accessible.

It’s not as polished as I’d like, but I told myself for something that’s just phase 1 of a set of experiments, I won’t worry about it too much.

The Game

(Use WASD to move)

Iterations

I plan on experimenting with a couple of other frameworks:

• React
• Three.js/Phaser.js

I’d like to come out of this with an idea of the pros and cons of using each framework for an application like this and for some perspective on how my choices in logic and design might change on each iteration