filmov
tv
Делаем игру Арканоид на Javascript. Урок HTML/CSS/JavaScript

Показать описание
📝В этом уроке мы создадим классическую игру "Арканоид" на JavaScript. Отрисовку графики будем выполнять внутри элемента canvas. Мы напишем логику движения мяча, управление платформой и обработку столкновений мяча с кирпичами. Также научимся вести счет и отслеживать количество жизней игрока.
🔗 Ссылка на код:
❓ Есть вопрос или проблема по фронтенду?
Пиши в комментарии к видео или в чат канала в ТГ:
⌚️ Таймкоды:
0:00 Введение. Показываю геймплей игры
0:24 Добавляем элемент canvas в HTML
0:58 Пишем стили
1:33 Начинаем писать Javascript
6:49 Заполнение массива с блоками начальными значениями
8:43 Пишем функцию отрисовки мяча
9:58 Пишем функцию, которая будет вызываться каждый кадр
11:53 Пишем функцию отрисовки платформы
12:53 Пишем функцию отрисовки кирпичей сверху
16:34 Пишем функцию отрисовки счета
16:41 Пишем функцию отрисовки жизней
17:37 Пишем логику столкновений мяча с кирпичиками
21:54 Пишем логику управления платформой с помощью мыши
23:43 Пишем логику отталкивания мяча от стенок и платформы
28:38 Проверяем игру
✔️ Подписывайтесь на канал, обучаю фронтенду просто. Готовится много новых уроков :)
🎵 Права на фоновую музыку:
Creative Commons / Attribution 3.0 Unported License (CC BY 3.0)
🔗 Ссылка на код:
❓ Есть вопрос или проблема по фронтенду?
Пиши в комментарии к видео или в чат канала в ТГ:
⌚️ Таймкоды:
0:00 Введение. Показываю геймплей игры
0:24 Добавляем элемент canvas в HTML
0:58 Пишем стили
1:33 Начинаем писать Javascript
6:49 Заполнение массива с блоками начальными значениями
8:43 Пишем функцию отрисовки мяча
9:58 Пишем функцию, которая будет вызываться каждый кадр
11:53 Пишем функцию отрисовки платформы
12:53 Пишем функцию отрисовки кирпичей сверху
16:34 Пишем функцию отрисовки счета
16:41 Пишем функцию отрисовки жизней
17:37 Пишем логику столкновений мяча с кирпичиками
21:54 Пишем логику управления платформой с помощью мыши
23:43 Пишем логику отталкивания мяча от стенок и платформы
28:38 Проверяем игру
✔️ Подписывайтесь на канал, обучаю фронтенду просто. Готовится много новых уроков :)
🎵 Права на фоновую музыку:
Creative Commons / Attribution 3.0 Unported License (CC BY 3.0)
Делаем игру Арканоид на Javascript. Урок HTML/CSS/JavaScript
Урок 8 - PointJS. Арканоид / Arkanoid. Часть 1. Как сделать свою компьютерную игру на js...
Пишем HTML5 арканоид на чистом JavaScript и Canvas [GeekBrains]
Арканоид на JS с нуля @Uncolored::Meetup Дмитрий Павличенко 2021-11-20...
JavaScript #22: пример создания начала игры арканоид
Игра ARKANOID в ChatGPT за 1 минуту. Оно работает!
Create Arkanoid Game in 5 minutes - JavaScript - 5minsofcode.com
Урок 9 - PointJS. Как сделать игру Арканоид / Arkanoid. Часть 2. Создаем свою браузерную игру...
Создание игры на чистом JavaScript за 20 минут!
[#24] Строим уровень, 2D платформер на Javascript | Игра на JS
Tutorial - Como fazer o jogo ARKANOID em JS e Canvas - Parte 1/2
Создание JavaScript Игры - 01 Начало
Создание игры платформера 'Мэрсио' на javascript
Игра Змейка на чистом JavaScript и HTML5 за 45 минут!
Создание JavaScript Игры - 02 Анимация
Arkanoid Game In JavaScript With Source Code | Source Code & Projects
Учимся разрабатывать 2D realtime игры на JavaScript [GeekBrains]
Создание Игры 'Угадай Число' На JavaScript | #1 - Дизайн Меню | Degreet...
Создание Простой Игры На JavaScript | #2 - Логика №1 | Игра 'Карточки с Цифрами' | Degreet...
Делаем игру с карточками (Memory) на JavaScript. Урок HTML/CSS/JS
Создание ИГР на JavaScript |#3| GameOver и Платформа
Игра На Чистом JAVASCRIPT На CANVAS (Анимация Персонажа)#5🕺🕺🕺...
[#26] Проверка столкновений со стеной, 2d платформер Javascript | Игра на JS...
Создание JavaScript Игры - 03 Столкновение
Комментарии