🚀 РАЗРАБОТКА ИГРЫ с НУЛЯ за 10 часов! [React / TS / Zustand]

Published: 06 July 2024
on channel: RED Group +
47,855
2.9k

🔥 Оформить премиум подписку - https://htmllessons.io/premium?utm_so...
❤️ Отзывы тут - https://t.me/htmllessons_reviews
🦋 ТГ канал - https://t.me/redgroupchannel

Адаптация игры под смартфоны -    • АДАПТАЦИЯ САЙТА на примере РЕАЛЬНОГО ...  

👍 2000-3000 лайков, будет хорошей платой за такой ролик и пишите в комменты как Вам формат живой разработки.

🖥 Скачивай исходник(+ стартовый проект для самостоятельной практики) или играй прям на платформе - https://htmllessons.io/repositories/9...

В этом видео мы создадим игру с нуля за 10 часов, используя мощный стэк: React, TypeScript, Zustand, Framer-motion, Tailwind и Bun. Погрузитесь в процесс разработки на React (reactjs, реакт) и TypeScript (TS, Тайпскрипт). Мы покроем все - от начальной инициализации PWA до создания UI компонентов и управлением состояниями через Zustand. Увидите, как настроить цвета, создать колоды карт, и многое другое. Это идеальное видео для тех, кто хочет углубиться в разработку игр и изучить новые технологии!

🔥 Развлекательная часть видео -    • СОЗДАЛ ИГРУ С НУЛЯ и исполнил мечту д...  

В этом видео:
PWA
Игровые механики
Анимации
Игровой стол
Атака картой и выбор таргета
И другие темы в тайм-кодах.

🍥 Тема в редактор/IDE - Catpuccin icons / Lunar eclipse golden hour (наверно 🤔)
🎹 Клавиатура - NuPhy Halo65 / switch Night Breeze | KZZI K75Pro / Moment linear switch

Если есть какие то вопросы по этой теме - дай знать в 💬 комментариях!

00:00:00 - Начало
00:02:36 - Стэк
00:03:06 - ДЕМО игры
00:07:22 - Предисловие
00:13:00 - Обзор карт
00:20:00 - Инициализация PWA
00:39:20 - Базовые настройки
00:44:40 - Цветовая схема
00:46:30 - Алиасы
00:48:50 - UI компоненты
01:27:50 - Карточки
01:31:00 - Типы карт
01:35:50 - Zustand (state)
01:38:36 - ВАЖНЫЙ ДИСКЛЕЙМЕР
01:39:20 - Описываем типы store
01:51:00 - Создание колоды
01:56:00 - Начало
01:59:00 - Завершение хода
02:12:00 - Карта на стол
02:17:00 - Атака карты
02:28:24 - Атака героя
02:37:00 - Главный компонент
02:52:00 - Игровой стол
03:09:40 - Компонент карты на поле
03:17:00 - Карты в руке
04:08:18 - ЭМОЦИИ
04:27:37 - Фикс багов анимации
04:35:00 - Мана
04:53:00 - Карточка героя
05:07:30 - Музыкальный плеер
05:16:26 - ЭМОЦИИ
05:18:44 - Загрузочный экран
05:40:00 - Правим визуал
05:47:00 - Уведомления
05:57:00 - Правим визуал
06:18:00 - Возврат карты в руку
06:30:00 - Фикс багов
06:36:00 - Улучшаем стартовую колоду
06:45:00 - Набор карт в начале
07:00:00 - Добор карт
07:14:00 - Атака картой и выбор таргета
07:45:50 - Продвинутые уведомления
08:26:00 - Селекты
08:40:00 - Фикс бага с маной
08:47:00 - Анимация удаления ХП
09:15:00 - Самое сложное Игра от компьютера
10:17:00 - Тест на смартфоне

🌿 Плейлист с полными курсами для новичков и не только -    • RED Course | Полные курсы за короткое...  
👉 Все ссылки (+ настройка редактора) и информация обо мне - https://htmllessons.io/links

Контакты для связи
[email protected] - Реклама и сотрудничество
[email protected] - Если хотите к нам в команду

#React #TypeScript #Zustand #RedGroup #RedGroupPlus


Watch video 🚀 РАЗРАБОТКА ИГРЫ с НУЛЯ за 10 часов! [React / TS / Zustand] online without registration, duration hours minute second in high quality. This video was added by user RED Group + 06 July 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 47,85 once and liked it 2.9 thousand people.