Уроки как создать чистую ООП архитектуру для детской игры. / Lessons on how to create a pure OOP architecture for a children's game.
Детская интерактивная пазл игра с животными на ts (TypeScript), написанная с целью обучения, где мы попытаемся разбить портянку старого кода и создать свою Чистую архитектуру проекта, придерживаясь ООП стиля программирования с использованием паттернов.
We are developing an interactive game of puzzles for children with animals using Typescript. We will do a refactor of the old code and try to write with pure architecture. Where we will use the design of the pattern.
Сложность урока/difficulty of the lesson: 🌕 🌕 🌕 🌕 🌗 (Очень сложно/Very hard)
-
Урок 0: Подготовка проекта. Установка Vite, Prettier и Konva.
📺 YouTube 📺 RuTube -
Урок 1: SVG нарезка и содание отдельных файлов c животными. Подготовка файла источника sources с набором координат.
📺 YouTube 📺 RuTubegit-branch: tutorial-01
-
Урок 2: Создание ImageLoaderService по загрузке изображений. Добавление типов для TS.
📺 YouTube 📺 RuTubegit-branch: tutorial2-create-image-loader-service
-
Урок 3: Применяем пораждающий паттерн Билдер (Builder). Приводим проект к ООП стилю.
📺 YouTube 📺 RuTubegit-branch: tutorial3-create-game-builder
-
Урок 4: Применяем пораждающий паттерн Фабрика (Simple Factory). Делаем небольшой рефакторинг.
📺 YouTube 📺 RuTubegit-branch: tutorial4-create-konva-factory
-
Урок 5: Применяем анти паттерн Одиночка (Singleton).
📺 YouTube 📺 RuTubegit-branch: tutorial5-create-pattern-singleton
-
Урок 6: Плюсы/минусы Синглитона в TypeScript. Создаем сервис для работе с размерами игры в ООП стиле.
📺 YouTube 📺 RuTubegit-branch: tutorial06-create-canvas-size-service
-
Урок 7: Применим SRP - принцип единой ответственности в TypeScript (SOLID).
📺 YouTube 📺 RuTubegit-branch: tutorial07-srp-animal-manager
-
Урок 8: Живой пример поведенческого паттерна Наблюдатель (Observer) на TypeScript / JavaScript.
📺 YouTube 📺 RuTubegit-branch: tutorial08-animal-observer
-
Урок 9: Создаем интерфейс для работы с игрой и добавим canvas confetti в callback завершения игры.
📺 YouTube 📺 RuTubegit-branch: tutorial09-create-api-game-add-confetti-to-game
-
Урок 10 CI/CD: Build и Deploy нашей игры на TS для публикации в Git Pages при помощи GitHub Actions.
📺 YouTube 📺 RuTubecommit: add deploy
- 🏆 https://github.com/davidbayra/game-puzzle-animals / 🕹 Play
- 🏆 https://github.com/karfagen86/tutorial-dnd-animals-v2 / 🕹 Play
- ⭐️ Поставь звезду проектам (справа наверху страницы)
- tutorial-dnd-animals
- tutorial-ascii-art
- 📺 Подпишись на канал.
- 💬 Оставь комментарий под видео.
- 👍 Воткни свой царский лайк.
- ☕️ boosty
- ☕️ donationalerts