Beginner JavaScript Project – Snake Game Tutorial

By freeCodeCamp.org
Published: Dec 07, 2023

“
In this beginners coding tutorial, you will learn to create a Retro Snake Game inspired by the iconic Nokia Snake game using vanilla HMTL, CSS and JavaScript! Using JS you will learn to draw the game board, create the snake and randomly generated food, make the snake move, increase the snake size when it eats, and increase its speed. you will also learn to keep the score, track collisions for the snake, and display your high score.

?? Course developed by @howtobecomeadeveloper

???? Deployed Game: https://snake-game-howtobedev.netlify.app/
???? GitHub Repo / Source Code: https://github.com/Ade-mir/snake-game-js

Snake AI-Generated Logo: https://github.com/Ade-mir/snake-game-js/blob/main/snake-game-ai-gen.png
Google Fonts: https://fonts.google.com/specimen/VT323?query=vt
AI font generator / Lexica: https://lexica.art/

?? Contents ??
?? (00:00) What we are building / Finished snake game
?? (01:57) Setting up our HTML
?? (10:25) Styling with CSS
?? (27:05) Creating the snake game logic with JavaScript

???? Thanks to our Champion and Sponsor supporters:
???? davthecoder
???? jedi-or-sith
???? ????
???? Agustín Kussrow
???? Nattira Maneerat
???? Heather Wcislo
???? Serhiy Kalinets
???? Justin Hual
???? Otis Morgan
???? Oscar Rahnama

—

Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://freecodecamp.org/news

[READ MORE]

”