# 🛍️ Freebie — Modern E-commerce Platform

Полноценное SPA-приложение для электронной коммерции, разработанное с разделением на современный React-фронтенд и мощный Django-бэкенд. Проект демонстрирует работу с глобальным состоянием, REST API, сессионной авторизацией и адаптивным UI/UX.

## 🚀 Особенности проекта

- 🛒 **Умная корзина в реальном времени:** Глобальное состояние через React Context. Изменения мгновенно отражаются в шапке, карточках товаров и на странице корзины без перезагрузки страницы.
- 🔌 **RESTful API:** Полноценный бэкенд на Django REST Framework для управления товарами, категориями, корзиной и отзывами.
- 👤 **Анонимные сессии:** Корзина сохраняется для гостевых пользователей с помощью сессионных cookies Django, что обеспечивает бесшовный пользовательский опыт до момента регистрации.
-  **Адаптивный дизайн:** Полная поддержка мобильных устройств, планшетов и десктопов с использованием CSS Modules.
- 🏷️ **Система промокодов:** Динамический пересчет стоимости заказа на фронтенде с учетом скидок и фиксированной стоимости доставки.

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

**Frontend:**
- React 18 + TypeScript
- Vite (быстрая сборка и Hot Module Replacement)
- React Router DOM (клиентская маршрутизация)
- CSS Modules (изолированная стилизация)

**Backend:**
- Python 3.12 + Django
- Django REST Framework (построение API)
- SQLite (база данных для разработки)
- `django-cors-headers` (настройка кросс-доменных запросов)
- `Pillow` (обработка загружаемых изображений)

---

## ⚙️ Инструкция по локальному запуску

Для запуска проекта на вашем компьютере необходимы предустановленные **Python 3.10+**, **Node.js 18+** и **Git**.

### Шаг 1: Клонирование репозитория

Откройте терминал и выполните команду:

```bash
git clone https://github.com/autli5/freebie.git
cd freebie
```

### Шаг 2: Настройка и запуск Backend (Django)

В этом же терминале выполните следующие команды для настройки серверной части:

# 1. Переходим в папку бэкенда
cd backend

# 2. Создаем виртуальное окружение
python -m venv venv

# 3. Активируем виртуальное окружение
# Для macOS / Linux:
source venv/bin/activate
# Для Windows (Command Prompt):
venv\Scripts\activate
# Для Windows (PowerShell):
venv\Scripts\Activate.ps1

# 4. Устанавливаем необходимые зависимости
pip install django djangorestframework django-cors-headers pillow

# 5. Применяем миграции для создания базы данных
python manage.py migrate

# 6. (Опционально) Создаем суперпользователя для доступа к админ-панели
python manage.py createsuperuser

# 7. Запускаем сервер разработки
python manage.py runserver

✅ Бэкенд будет доступен по адресу: http://127.0.0.1:8000/
✅ API товаров: http://127.0.0.1:8000/api/products/
✅ Админ-панель: http://127.0.0.1:8000/admin/

Важно: Оставьте этот терминал открытым, чтобы сервер продолжал работать.

### Шаг 3: Настройка и запуск Frontend (React)

Откройте новый терминал (или новую вкладку) в той же корневой папке проекта:

# 1. Переходим в папку фронтенда
cd frontend

# 2. Устанавливаем зависимости из package.json
npm install

# 3. Запускаем сервер разработки Vite
npm run dev

✅ Фронтенд будет доступен по адресу: http://localhost:5173/