Todo App

Простое Todo приложение, созданное для демонстрации архитектурных подходов в разработке приложений.

Архитектура

Проект построен с акцентом на разделение бизнес-логики и представления. Основные архитектурные решения:

• Сервисный слой - вся бизнес-логика изолирована в сервисах, что обеспечивает её переиспользуемость и тестируемость
• Service Locator + DI - применены паттерны для управления зависимостями и доступом к сервисам
• Интеграция MobX и TanStack Query - реализована эффективная синхронизация UI и серверных данных:
  • Сервисы получают данные напрямую из кеша TanStack Query
  • MobX реактивно обновляет UI при изменении кеша
  • Исключено дублирование состояния между MobX и Query
• Оптимистичные обновления - мгновенный отклик UI с последующей синхронизацией с сервером
• Модульная структура - компоненты разделены на умные (с логикой) и глупые (только отрисовка)

Запуск проекта

Установка зависимостей

yarn install

Запуск сервера разработки

# Запуск json-server (API)
yarn server

# В другом терминале запуск клиента
yarn dev

Приложение будет доступно по адресу http://localhost:3000
API сервер запустится на http://localhost:3001

Структура проекта

src/
  ├── api/          # API эндпоинты и модели (DTO)
  ├── core/         # Бизнес логика и сервисы
  ├── modules/      # Функциональные модули
  ├── pages/        # Страницы Next.js
  └── shared/       # Переиспользуемые утилиты, компоненты, хуки и т.д.

Разработка

• yarn dev - Запуск режима разработки
• yarn build - Сборка проекта
• yarn start - Запуск собранного проекта
• yarn server - Запуск json-server
• yarn lint - Проверка кода линтером
• yarn prettier - Форматирование кода