Игра "4 в ряд" (Connect Four)

Классическая логическая игра, где нужно выстроить 4 фишки подряд — по вертикали, горизонтали или диагонали. Игроки ходят по очереди, цель — первым собрать линию из своих фишек. Игроки могут выбрать размер поля и количество фишек для победы

---

Онлайн-версия

Играть онлайн

---

Требования для запуска

• Node.js версии 16+
• npm для установки зависимостей

Установка и запуск

1. git clone https://github.com/alekseevgr/connect-four.git
2. cd connect-four
3. npm install
4. npm run dev

Функция validator

Функция validator(Задание 2) находится в корне проекта, файл validator.ts

Что считаю сильной стороной

1. Интерфейс игры

Игрок может выбирать поле, выбирать кол-во фишек. При вводе данных в форму(имена, кол-во фишек) работает валидация и игроки видят ошибку в соответствующем поле, и пока ошибка не будет исправлена, начать игру нельзя. С помощью такого решения, игроки будут точно с разными именами, и не может быть ситуации когда невозможно победить в игре.

2. Redux для управления состоянием.

Всё состояние хранится в глобальном сторе. Это упрощает расширение игры и добавление новых функций (например, undo/redo).

3. Разделение логики по слайсам.

• gameSlice — текущее состояние игры (доска, ход, победитель);

• uiSlice — работа с интерфейсом (экраны, ошибки, настройки);

• statsSlice — статистика побед за всё время.

Такое решение помогает мне разделять типы состояния, отделять данные от UI, и дает возможность легче расширять игру.

4. Сохранение данных в localStorage через Redux Persist.

При обновлении страницы сохраняется процесс игры. Если запустить новую игру или вернуться в меню, сохраняется рейтинг победителей на устройстве(браузере)

---

Технологии

• React — интерфейс и компоненты

• Redux Toolkit — управление состоянием

• TypeScript — типизация и безопасность кода

• Vite — сборка и локальный сервер разработки

• Redux Persist — сохранение данных