🚀 Demo Components Project

Современное веб-приложение на FastAPI с полным набором компонентов для демонстрации возможностей фреймворка.

📋 Описание

Проект представляет собой полнофункциональное веб-приложение с системой аутентификации, профилями пользователей, медиа-галереей, интернет-магазином и другими компонентами. Идеально подходит для изучения FastAPI и создания прототипов.

✨ Основные возможности

🔐 Аутентификация и авторизация

• Регистрация и вход пользователей
• JWT токены для безопасной аутентификации
• OAuth2 интеграция (VK, Google)
• Восстановление пароля через email
• Email верификация

👤 Профили пользователей

• Редактирование личных данных
• Загрузка и изменение аватара
• Управление настройками аккаунта
• История активности

🎨 Медиа компоненты

• Галерея изображений с фильтрацией и поиском
• Видео плеер с полным набором контролов
• Аудио плеер с управлением воспроизведением
• Слайдер контента с автоматическим переключением
• Lightbox для просмотра изображений

📁 Управление файлами

• Загрузка файлов (изображения, видео, аудио, документы, архивы)
• Поддержка drag & drop
• Переименование, скачивание и удаление файлов
• Валидация типов и размеров (макс. 50 MB)
• Категоризация по типам
• Отображение метаданных (размер, дата загрузки)

🛒 Интернет-магазин

• Каталог товаров с фильтрами
• Корзина покупок
• Система категорий
• Поиск по товарам

🎭 UI компоненты

• Адаптивный дизайн
• Темная/светлая тема
• Модальные окна
• Уведомления (toast)
• Аккордеоны (FAQ)
• Формы с валидацией
• SVG иконки

🛠 Технологический стек

Backend

• FastAPI 0.104+ - современный асинхронный фреймворк
• SQLAlchemy 2.0 - ORM для работы с базой данных
• SQLite - легковесная БД (aiosqlite для async)
• Pydantic 2.0 - валидация данных
• Uvicorn - ASGI сервер
• Python 3.13 - последняя версия Python

Frontend

• HTML5 - современная разметка
• CSS3 - стили с переменными и градиентами
• JavaScript ES6+ - интерактивность
• Jinja2 - шаблонизация

Безопасность

• JWT (python-jose) - токены аутентификации
• Bcrypt (passlib) - хеширование паролей
• Email validation - проверка email адресов
• OAuth2 - авторизация через соцсети

Дополнительно

• Pillow - обработка изображений
• aiosmtplib - отправка email
• httpx - HTTP клиент для API запросов
• python-multipart - загрузка файлов

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

Требования

• Python 3.13+
• pip

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

# Установка зависимостей
pip install -r requirements.txt

Запуск приложения

# Перейдите в директорию backend
cd backend

# Запуск сервера
python -m uvicorn main:app --host 127.0.0.1 --port 8000

Приложение будет доступно по адресу: http://127.0.0.1:8000

Тестовый аккаунт

При первом запуске автоматически создается тестовый пользователь:

Email: test@demo.com
Пароль: Test1234!

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

demo/
├── backend/
│   ├── main.py                 # Главный файл приложения
│   ├── config.py              # Конфигурация
│   ├── database.py            # Настройка БД
│   ├── modules/               # Модули приложения
│   │   ├── auth/             # Аутентификация
│   │   │   ├── routes.py
│   │   │   ├── security.py
│   │   │   └── email_service.py
│   │   ├── profile/          # Профили
│   │   ├── media/            # Медиа файлы
│   │   ├── shop/             # Магазин
│   │   ├── components/       # UI компоненты
│   │   └── common/           # Общие компоненты
│   └── frontend/
│       ├── static/           # Статические файлы
│       │   ├── css/
│       │   ├── js/
│       │   ├── images/
│       │   └── uploads/
│       └── templates/        # HTML шаблоны
├── requirements.txt          # Зависимости
└── README.md                # Документация

API Endpoints

Аутентификация (/api/auth)

• POST /register - Регистрация
• POST /login - Вход
• POST /logout - Выход
• POST /forgot-password - Восстановление пароля
• GET /verify-email/{token} - Верификация email

Профиль (/api/profile)

• GET /me - Получить профиль
• PUT /update - Обновить профиль
• POST /avatar - Загрузить аватар
• DELETE /avatar - Удалить аватар

Медиа (/api/media)

• GET /gallery - Список изображений
• POST /upload - Загрузить файл
• GET /files - Список файлов
• GET /files/{id} - Получить файл
• DELETE /files/{id} - Удалить файл
• POST /files/{id}/rename - Переименовать
• GET /download/{id} - Скачать файл
• GET /storage-info - Статистика хранилища

Магазин (/api/shop)

• GET /products - Список товаров
• GET /products/{id} - Товар по ID
• GET /categories - Категории
• POST /cart/add - Добавить в корзину
• GET /cart - Получить корзину