Игра Змейка на чистом JavaScript и HTML5 за 45 минут!

preview_player
Показать описание
Представляю вам большой урок, в ходе которого мы создадим полноценную красивую игру на чистом JavaScript и HTML5. Игра будет копировать классическую игру "Змейка", при этом в конце урока мы загрузим игру на сервер чтобы все смогли поиграть в игру.

✔ Хостинг можно получить в подарок, но количество активаций ограничено! Используйте промокод GOSHA_HOST. Промокод действителен лишь для тарифа Host-0 и доступен только для первых 30 счастливчиков!

✔ -------------

- Уроки от #GoshaDudar 👨🏼‍💻
- Все уроки по хештегу #goshaLessons
Рекомендации по теме
Комментарии
Автор

Гоша, пожалуйста, по больше уроков, по созданию игр. Здоровья тебе :)

volt
Автор

3:37 - Я сразу понял, что наконец-то нашёл того, кто хотябы ЗНАЕТ о ES6!

reallygood
Автор

Чувак, ты самый лучший! Спсибо тебе за все твои уроки! Желаю как можно больше успехов в творчестве!!

lyonya
Автор

Хороший урок, есть чуток замечаний:
1) Код загроможден переменной bох, надо оставит её только для отрисовки в пикселах, а все сравнения и расчеты по координатам вести в количестве самих ячеек, а не в пикселах;
2) Есть объект food, тогда и картинку еды перенести надо в этот объект
3) Есть объект snake, тогда и направление dir перенести в этот объект
4) Есть голова змеи head, snakeX и snakeY - тогда их тоже вложить в объект snake
P.S. По коду "размазаны" переменные, которые через 2 недели не вспомнишь что они делают - их надо логически вкладывать в объекты

ivanovserg
Автор

Привет, в canvas остаются следы предыдущего местоположения змейки и кажется что ты рисуешь ею на поле. Такой же баг повторяется и с score. Цифра не обновляется а накладывается на предыдущее т.е. на 0 рисуется единичка и тд. Решила проблему добавив ctx.clearRect(0, 0, 609, 609); в самое начало функции drawGame(). Может кому понадобится.

irinax
Автор

Жалко, что у вас так мало видео про игры на джаваскрипт. Спасибо !!

kukusikibabasikitv
Автор

Спасибо за видео, я теперь знаю как запустить свои файлы на сервер) И узнала многое что о программировании)

atsuko_shittl.j
Автор

один из очень немногих, на кого я езьже отдущи подписался, отдущи поставил лайк, отдущи оставляю коммент!

Hande_hoch
Автор

Подскажите насчет ошибки. При выполнении интервала на 11:11 в консоли выдает "Uncaught TypeError: Cannot read property 'drawImage' of null
at drawGame"

iAmSvyat
Автор

Подскажите, как привязать звуки к клавишам, типо когда змея умирает, когда ест и двигается

lubsnyf
Автор

Супер🤝🏆слушай топчик еще бы game over по соли экрана это реально не подскажешь как🤔😆
Короч я решил заняться плотно веб разработкой и тут столкнулся с js пока не платно занимаюсь ! Есть советик !? С чего лучше начинать html и css знаю не так хорошо но знаю но говорят в наше время js всем глава без него ни куда ! Что скажешь!?

ganjackal
Автор

спасибо за урок, было бы интересно как еще регулировать скорость змейки

progi
Автор

Не до смотрел но все равно ТОП! Спасибо за видео :D

joefast
Автор

что делать, ошибка game.js:48 Uncaught DOMException: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The HTMLImageElement provided is in the 'broken' state.
at drawGame (

durkaRealLol
Автор

А почему Гошу критикуют на других каналах? Хорошо он рассказывает, всё понятно. Конечно для понимания база какая-то нужна, без неё никуда. А так всё норм, всё подробно, чего писать, куда вставлять, почему такое действие.

VIJana
Автор

Игра на JavaScript удалась! Спасибо!

nurkblw
Автор

Привет Георгий я писал игру я смотрел все твои уроки по Js и я решил посмотреть это видео в коде у меня показывает что все правильно но когда я зашел в консоль у меня выдало ошибку почему?

igixprffikiberg
Автор

Приветствую, насколько сильно нужно будет допилить игру, чтобы была возможность у пользователя сохранить фи и почту, чтобы сохранить/вывести таблицу с результатами?

slava_tfdf
Автор

Не хочу выпендриваться, я новичок в этом деле, но я бы создал функцию, которая каждый рандомно генерирует еду, типа function createfood() {тут прописать рандомное появление еды}
А переменную food просто объявить, затем вызвать эту функцию и каждый раз вызывать функция, когда змея проглатывает пищу)
Спасибо за урок)

-april
Автор

Что-то не могу понять с рандомом. Если он генерирует от 0 до 1, то как получаются координаты больше 1 и меньше 17 при умножении?

GANGSTER