snake game with vanilla JavaScript

Frontend project from scratch with HTML5, CSS & JavaScript
(No frameworks or libraries)

How to design the game?

1. think about how many objects involved in this game?

• map:
  • width
  • height
  • square
  • x
  • y
  • show the map on the browser
• food
  • width
  • height
  • display the food on the map
• snake
  • body
  • width
  • height
  • methods:
    • move
    • control the directions
    • hit the border, then game over
    • hit the food, then
    • hit itself, then game over
• game rule *

2. think about how to make the objects moving?

• create all the objects mentioned above
• start
• stop