ESCLIENT Mobile App

Современное мобильное приложение для просмотра и управления модами, созданное на Flutter с интеграцией GraphQL. Приложение точно воспроизводит дизайн из Figma макета с улучшенным state management и производительностью.

✨ Особенности

• Современный дизайн в темной теме с точным соответствием Figma макету
• Поиск модов по названию, описанию и тегам в реальном времени
• Фильтрация по периодам (все время, месяц, неделя, недавние)
• Система рейтингов со звездами и статистикой скачиваний
• Теги модов для категоризации контента
• Адаптивный интерфейс для разных размеров экранов
• GraphQL интеграция с fallback на моковые данные
• Pull-to-refresh для обновления списка
• Hero анимации для плавных переходов
• Оптимизированное состояние с проверками mounted

🏗 Архитектура проекта

lib/
├── main.dart                 # Точка входа приложения
├── model/
│   ├── comments.dart         # Модель комментариев
│   └── mod_item.dart         # Модель модов
├── pages/
│   └── mods_list_page.dart   # Главная страница с улучшенным state management
├── services/
│   ├── comments.dart         # Сервис комментариев
│   ├── graphql_client.dart   # GraphQL клиент
│   └── mods_service.dart     # Сервис модов с обработкой ошибок
├── utils/
│   ├── constants.dart        # Константы приложения
│   └── app_theme.dart        # Тема приложения
└── widgets/
    └── mod_card.dart         # Улучшенный виджет карточки мода

🎨 Дизайн система

Цветовая палитра

• Основной фон: #1F2937
• Карточки: #181F2A
• Границы: #374151
• Акцент: #388E3C (зеленый)
• Рейтинг: #F59E0B (желтый)
• Текст: #FFFFFF, #D1D5DB, #9CA3AF

Типографика

• Основной шрифт: Roboto
• Дополнительный: Inter
• Размеры: 20px (заголовки), 16px (подзаголовки), 14px (текст), 12px (описания)

🚀 Функциональность

Главный экран

• Поисковая строка с диалоговым окном и автофокусом
• Период фильтры с анимированным переключением
• Список модов с pull-to-refresh
• Состояния загрузки и пустых результатов
• Нижняя навигация с placeholder функциями

Карточка мода

• Hero анимации для изображений
• Звездный рейтинг с динамическим количеством звезд
• Теги с ограничением отображения
• InkWell эффекты для лучшего UX

Детальный просмотр

• Модальное окно с 70% высоты экрана
• Полное описание с прокруткой
• Статистика (рейтинг, скачивания)
• Все теги мода
• Кнопка скачивания с обратной связью

🔧 Технические улучшения

State Management

• Проверки mounted для предотвращения утечек памяти
• Правильная очистка ресурсов в dispose()
• Обработка состояний загрузки и ошибок
• Кэширование результатов поиска

Производительность

• const конструкторы где возможно
• Оптимизированные ListView.builder
• Ленивая загрузка изображений
• Минимизация rebuilds с помощью keys

UX/UI

• Анимации переходов (200-300ms)
• Обратная связь для всех действий
• Graceful error handling
• Адаптивные размеры и отступы

📦 Зависимости

Основные

• flutter: SDK
• graphql_flutter: ^5.2.0: GraphQL клиент
• cupertino_icons: ^1.0.8: iOS стиль иконки

Разработка

• flutter_test: Тестирование
• flutter_lints: ^6.0.0: Анализ кода

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

Требования

• Flutter SDK 3.8.1+
• Dart 3.0+
• Android Studio / VS Code
• Git

Команды

# Переход в папку проекта
cd D:\GITHUB\ESCLIENT\mobile-app

# Установка зависимостей
flutter pub get

# Запуск в режиме разработки
flutter run

# Сборка для релиза
flutter build apk --release

🔄 Следующие шаги

• Интеграция с реальным GraphQL API
• Добавление аутентификации пользователей
• Реализация системы избранного
• Добавление push-уведомлений
• Система комментариев и отзывов
• Кэширование данных для оффлайн режима
• Интернационализация (i18n)
• Unit и Integration тесты
• CI/CD pipeline
• Метрики и аналитика

🐛 Известные проблемы

• Моковые данные вместо реального API
• Отсутствует система аутентификации
• Фильтры и уведомления не реализованы
• Нет оффлайн режима

🤝 Вклад в проект

1. Fork репозитория
2. Создайте feature branch
3. Внесите изменения
4. Добавьте тесты
5. Создайте Pull Request

📄 Лицензия

Этот проект использует MIT лицензию.

👥 Команда

• UI/UX Design: Figma макет
• Flutter Development: Адаптация под Flutter
• State Management: Оптимизация производительности
• Quality Assurance: Code review и тестирование

📞 Поддержка

При возникновении проблем создайте Issue в GitHub репозитории или свяжитесь с командой разработки.