Snake Game

How it was implemented

A grid-based canvas updates at a fixed interval. The snake is an array of positions; movement and food spawning are handled with simple rules.

What I learned

• DOM querying trade-offs: getElementById vs querySelector for clarity and flexibility.
• Canvas 2D basics: getContext("2d"), fillStyle/strokeStyle, fillRect, and strokeRect.
• Array utilities in gameplay loops: forEach(...) for iteration and unshift(...) to grow the snake at the head.
• Generating bounded random positions (e.g., within a 0–500 grid) for food placement.
• Keyboard handling with window.addEventListener("keydown", ...) and reading event.keyCode to change direction.