До 30 ноября

Скидки до 81 000 руб и вторая профессия в подарок!

Главная | Все статьи | Дневник студента

Игра на JS. Обновление

Время чтения статьи ~1 минута
Статья написана студентом Хекслета. Мнение автора может не совпадать с позицией редакции
Игра на JS. Обновление главное изображение

Всем привет!

Ранее я обозначил ряд элементов, которые хотел привнести в игру. К сожалению, некоторые вещи добавить не удалось, но обо всём по порядку.

Что удалось

battle log. Это оказалось достаточно просто, и единственным, что вызвало затруднения, оказалась полоса прокрутки. Стилизовать scroll с помощью CSS — не сложно. Проблема в том, что работать такая стилизация будет не во всех браузерах, и этот момент я пока не решил, ибо посчитал несущественным. А вот тот факт, что при каждой новой записи полоса прокрутки убегала вверх, меня знатно напрягал. Чтобы это исправить я познакомился с MutationObserver, который может отслеживать изменения в DOM.

Способности героев. Получилось реализовать способность героя разрушать вражескую броню при каждой атаке.

Модульность. Разбил код на модули, чтобы было удобнее работать.

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

Линтер. Теперь мы с линтером лучшие друзья.

Что не удалось

battle log. Да, пункты здесь будут повторяться. Почему не удалось, если всё работает? Потому что при моей реализации с этим логом очень неудобно работать. Я не создавал отдельную сущность под него в JS и понял свою ошибку слишком поздно.

Способности героев. Тут схожая проблема. Чтобы создавать уникальные способности нужно отслеживать определённые события (получение урона, завершение хода и т.д.). Сейчас это делать очень сложно, поэтому я пока ограничился лишь одной простой способностью.

Что дальше?

Недавно я начал проходить курс Архитектура фронтенда и понял, что многие проблемы в игре могут быть решены с введением состояний, но для этого придётся переписать весь код, что довольно печально. Но я решил сначала доделать боевую часть без исправлений, а уже когда начну заниматься остальными аспектами игры, то переписать всё заново. Таков путь.

Поиграть в игру.

Посмотреть код.

Аватар пользователя Георгий Баратели
Георгий Баратели 03 марта 2021
5
Рекомендуемые программы
профессия
Осваивайте разработку веб-страниц, оживляйте дизайн макетов, публикуйте сайты и приложения. Отслеживайте ошибки в интерфейсе и устраняйте их
10 месяцев
с нуля
Старт 28 ноября
профессия
Обучитесь разработке бэкенда сайтов и веб-приложений — серверной части, которая отвечает за логику и базы данных
10 месяцев
с нуля
Старт 28 ноября
профессия
Выполняйте ручное тестирование веб-приложений, находите ошибки в продукте. Узнайте все о тест-дизайне.
4 месяца
с нуля
Старт 28 ноября
профессия
Научитесь разработке веб-приложений, сайтов и программного обеспечения на языке Java, программируйте и используйте структуры данных
10 месяцев
с нуля
Старт 28 ноября
профессия
новый
Собирайте, анализируйте и интерпретируйте данные, улучшайте бизнес-процессы и продукт компании. Обучитесь работе с библиотеками Python
9 месяцев
с нуля
Старт 28 ноября
профессия
Занимайтесь созданием сайтов, веб-приложений, сервисов и их интеграцией с внутренними бизнес-системами на бекенд-языке PHP
10 месяцев
с нуля
Старт 28 ноября
профессия
Создание веб-приложений со скоростью света
5 месяцев
c опытом
Старт 28 ноября
профессия
Обучитесь разработке визуальной части сайта — фронтенда, а также реализации серверной — бэкенда. Освойте HTML, CSS, JavaScript
16 месяцев
с нуля
Старт 28 ноября
профессия
Разработка бэкенд-компонентов для веб-приложений
10 месяцев
с нуля
Старт 28 ноября
профессия
новый
Организовывайте процесс автоматизации тестирования на проекте, обучитесь языку программирования JavaScript, начните управлять процессом тестирования
8 месяцев
c опытом
Старт 28 ноября