Nine flags

Nine flags — разработка стратегической карточной игры на React + TypeScript

Создать браузерную реализацию настольной игры Battle Line, адаптированную для одиночной игры против ИИ и для двух игроков по сети. Игра должна поддерживать все правила оригинала: девять флагов, комбинации карт по силе, логика захвата флагов и подсчёт победных линий.

В ходе проекта были выполнены следующие работы:

Архитектура приложения: разбивка на UI-компоненты (дек, флаги, панель управления), сервисы состояния (Redux Toolkit) и модули бизнес-логики.

Игровой движок: реализация модели карт, генерация и тасование колоды, проверка комбинаций (старшая карта, две пары, флеш и т.д.), механика установки карт на флаги.

ИИ-противник: алгоритм minimax с глубиной просмотра 2–3 хода, оптимизированный для скорости и при этом обеспечивающий сложность на уровне новичка/среднего игрока.

Интерфейс и анимации: карточные переходы, флип-эффект с помощью Framer Motion; адаптивный дизайн для десктопа и мобильных браузеров.

Тестирование и оптимизация: модульные тесты для логики комбинаций (Jest), нагрузочное тестирование отрисовки флагов (React Profiler), lazy-loading компонентов для ускорения старта.

Формирование схемы данных: модели карт, игроков и флагов.

Настройка Redux Toolkit для управления состоянием партии.

Разработка архитектурных диаграмм компонентов в Figma (или Sketch).

Кодирование логики тасования и раздачи карт.

Функции проверки комбинаций для каждого флага (старшая карта, стрит, флеш и пр.).

Разработка алгоритма ИИ-противника с minimax и эвристикой оценки позиций.

Верстка основных экранов: стол игрока, стол ИИ, панель управления.

Интеграция Framer Motion для анимаций флипа и перемещения карт.

Адаптивные стили через Tailwind CSS для корректного отображения на мобильных устройствах.

Написание unit-тестов для проверки всех комбинаций карт.

Профилирование рендеринга компонентов, устранение лишних перерисовок.

Деплой на Vercel и настройка CI/CD (GitHub Actions) для автоматических сборок и тестов.