Coding Snake Game in Svelte.js (Javascript)
In this tutorial we'll be using Svelte.JS, an easy to use web framework based on HTML, CSS, and Javascript, to build a snake game. If you don't know Svelte.JS click on the example links below to learn more.
Svelte JS Official Website
https://svelte.dev
Live Demo:
https://phptuts.github.io/snake_game_ty/
Code:
https://github.com/phptuts/snake_game_ty
Starter Code:
https://github.com/phptuts/snake_game...
Example Links
(Props) https://svelte.dev/examples#declaring...
(If Template) https://svelte.dev/examples#if-blocks
(Each Template) https://svelte.dev/examples#each-blocks
(Dom Events) https://svelte.dev/examples#dom-events
(Reactive Declarations) https://svelte.dev/examples#reactive-...
(Svelte Window) https://svelte.dev/examples#svelte-wi...
(Svelte Shorthand Props) https://svelte.dev/repl/72808c5cdce14...
00:00 Introduction
00:20 Starter Code Tour
https://github.com/phptuts/snake_game...
02:02 Food Component Props
https://github.com/phptuts/snake_game...
02:48 SnakeBody Component Props
https://github.com/phptuts/snake_game...
03:59 Creating SnakeBodies
https://github.com/phptuts/snake_game...
05:19 Keyboard Events
https://github.com/phptuts/snake_game...
07:07 Snake Moves
https://github.com/phptuts/snake_game...
08:57 Snake Ate Apple
https://github.com/phptuts/snake_game...
10:47 Game Over Function
https://github.com/phptuts/snake_game...
11:52 Reset Game Function
https://github.com/phptuts/snake_game...
12:34 Challenge
https://github.com/phptuts/snake_game...
13:02 Github Pages
https://github.com/phptuts/snake_game...
13:36 Final Demo and Outro
Notes / Errors
To prevent scrolling with the game have the onKeyDown Method take in an event parameter and call preventDefault. Also, the original game did not allow users to die so easily. So if you are going down you should not be able to go up. These are some minor fixes you can do to make the game better.
On this page of the site you can watch the video online Coding Snake Game in Svelte.js (Javascript) with a duration of hours minute second in good quality, which was uploaded by the user Noah Glaser 16 May 2020, share the link with friends and acquaintances, this video has already been watched 2,537 times on youtube and it was liked by 53 viewers. Enjoy your viewing!
