LOVII PIZZA — сайт доставки

Сайт доставки пиццы: 333 товара, корзина, система лояльности, 18 категорий.

← Все документы

LOVII PIZZA — Руководство по проекту

Обзор проекта

LOVII PIZZA — современный сайт доставки неаполитанской пиццы с красивым и функциональным дизайном. Двухколоночный layout со sticky-навигацией, корзиной, системой лояльности и мотивации, профилями доставки и бэкендом на Yandex Cloud Functions.

  • 333 товара в 18 категориях
  • Пицца 30 см, Piccolo 20 см, Кальцоне
  • Роллы, суши, хлеб, фокачча
  • Комбо-наборы, десерты, напитки
  • Замороженная продукция, ароматные масла
  • Мастер-классы, франшиза, контакты

Архитектура

Frontend

  • index.html — двухколоночный layout (sidebar + контент)
  • css/main.css — все стили
  • js/config.js — конфигурация приложения
  • js/app-delivery.js (~1420 строк) — вся логика: загрузка меню, корзина, сортировка, отправка заказа

Backend

Go-функция на Yandex Cloud Functions — тонкий транспорт к Max Bot API. Принимает сформированный на фронте HTML заказа и форвардит в Telegram-канал.

  • backend/max-order/index.go — handler (CORS, валидация, форвард)
  • backend/setup.sh — bootstrap (SA + Lockbox)
  • backend/deploy.sh — деплой версии функции
  • Секреты (MAX_TOKEN, MAX_CHAT_ID) — в Yandex Lockbox
  • Rate limit: 30 req/min на инстанс
  • CORS whitelist: pizza.lovii.ru + локальные dev-порты

Данные

menu-final.json — канонические данные меню (333 товара):

{
  "title": "Пицца Маргарита",
  "price": 650,
  "image": "img/800/0002-....webp",
  "id": 3,
  "category": "pizza-30cm",
  "description": "...",
  "weight": 500
}

Ключевые возможности

Корзина

  • Добавление/удаление товаров, изменение количества
  • Сохранение в localStorage
  • Мини-корзина в хедере с анимацией pulse
  • Модальное окно с полной формой заказа
  • Расчёт стоимости доставки
  • Выбор способа оплаты (карта, СБП, наличные)

Система лояльности (7 уровней подарков)

Сумма заказаПодарок
750 ₽Бесплатная доставка
1 250 ₽Неаполитанский хлеб Классический
1 750 ₽Сок яблочный собственного производства
2 250 ₽Кальцоне-мини «4 сыра»
2 750 ₽Pizza Piccolo 4 сыра
3 250 ₽Пицца 4 сыра
3 750 ₽Ролл Филадельфия с лососем

При достижении порога клиент выбирает один подарок. Прогресс-бар отображает текущий уровень и следующий доступный подарок.

Профили доставки

Два режима работы, переключаемые через URL-параметр ?source=:

ПараметрHome (доставка)Partner (локации)
Беспл. доставка от1 500 ₽750 ₽
Стоимость доставки199 ₽99 ₽
Мин. заказ750 ₽750 ₽
ОплатаКарта, СБП, наличные без сдачиКарта, СБП, наличные
АдресТребуетсяНе требуется

Источники-партнёры: 12 комнат, Музей Гарри Поттера, Музей СВО, Отель Ломоносов, Караоке Party Time, Музыкальная Школа, Супер Соник.

Сортировка

  • Рекомендуем — хиты продаж в начале + цена по убыванию
  • Цена по возрастанию
  • Цена по убыванию
  • Desktop: кастомный дропдаун в хедере
  • Mobile: FAB-кнопка с bottom sheet

Тайм-менеджмент

Автоматическое переключение режимов работы по времени:

  • 10:00–20:30 — обычный режим, приём заказов
  • 20:30–21:00 — предупреждение «Доставляем до 22:00»
  • 21:00–22:00 — предупреждение + запрос адреса (самовывоз)
  • 22:00–06:00 — закрыто, ссылка на Яндекс Еду

Тёмная и светлая темы

  • Переключение в мобильном меню
  • Сохранение выбора в localStorage
  • Атрибут data-theme на <html>

Ленивая загрузка (Lazy Loading)

  • 12 товаров за один load
  • IntersectionObserver для подгрузки при скролле
  • 3 начальные группы категорий

Мобильная версия

  • Бургер-меню с выезжающим сайдбаром
  • FAB для сортировки
  • Оптимизированные изображения 800px
  • Touch-friendly элементы

Статистика

МетрикаЗначение
Всего товаров333
Категорий18
Изображений (WebP 800px)255
Оригиналов (WebP 1200x800)255
Хитов продаж (HIT_IDS)77
Уровней лояльности7
Строк JS (app-delivery.js)~1420

Конфигурация

Все настройки в js/config.js:

  • ORDER_CONFIG.maxEndpoint — URL Yandex Cloud Function
  • ORDER_SOURCES — справочник источников трафика
  • SOURCE_CONFIGS — профили доставки (home/partner)
  • CATEGORY_GROUPS — группы категорий для ленивой загрузки
  • CATEGORY_MAP — русские названия категорий
  • HIT_IDS — ID товаров-хитов
  • MAINTENANCE_MODE — заглушка «временно не работаем»
  • LAZY_LOAD_CONFIG — настройки ленивой загрузки

Быстрый старт

# Просто откройте index.html в браузере
open index.html