vibecodai logovibecodai

Quest 8 of 10 · 🐍 · Free · No setup

Snake

Set up a canvas, move the snake on a timer, eat food, and handle arrow keys. One of the best beginner JavaScript projects — live in your browser.

  • In-browser live preview
  • Saved on this device
  • Unlocks: Game loops — timers, grids, and keyboard input

Part of Web Dev Quests · Prefer prompts? Vibe Code Studio →

Step: HTML

Game canvas

Set up canvas for drawing Snake.

<canvas> is a drawable surface for games. Width and height set the grid area.

Your quest

Add a restart button below the canvas.

Edit HTML

HTML
Live preview