Фудтех / Стрит-фуд
Radio Burger — PWA и система онлайн-заказов
Radio Burger
Full-stack разработка
Полноценная цифровая экосистема для уличного кафе в Санкт-Петербурге: PWA-приложение для клиентов, Kanban-панель для персонала и real-time система заказов. Разработано за 38 дней — от Prisma-схемы до боевого деплоя с SSL и PM2.
Сайт-визитка Radio Burger
PWA — Меню с категориями
Kanban-дашборд реального времени
Все заказы — поиск и фильтрация
Управление меню
Аналитика и статистика
Настройки — СБП QR и часы работы
Пользователи и роли
38
дней разработки
298
коммитов в репозитории
~0%
потерянных заказов
16 595
строк TypeScript-кода
31
API-эндпоинтов
4
цикла security audit
?
Задача
Radio Burger работал через Telegram-группу: клиенты писали заказы вручную, администраторы вели учёт в мессенджере. Заказы терялись, оплата не отслеживалась, аналитики не было. При любом сбое Telegram — бизнес останавливался полностью. Фото блюд не обновлялись, не было инструмента для управления меню.
Решение
Разработана full-stack экосистема на Next.js 14 + PostgreSQL + Socket.io: PWA-приложение (меню → корзина → заказ → чат → СБП QR-оплата), Kanban-дашборд для персонала с real-time обновлениями и звуковыми сигналами, CRUD-панель для управления меню с автоконвертацией фото в WebP. Push-уведомления — без Firebase, через нативный Web Push API (VAPID), данные строго на серверах РФ (152-ФЗ).
Технологический стек
| Слой | Технология | Задача |
|---|---|---|
| Frontend | Next.js 14 + React 18 | App Router, Server Components, SEO |
| Язык | TypeScript strict mode | Типобезопасность, ноль any |
| Стили | Tailwind CSS | Utility-first, адаптивность |
| База данных | PostgreSQL 15 | Серверы Beget РФ (152-ФЗ) |
| ORM | Prisma | Типобезопасный доступ к БД, Studio GUI |
| Real-time | Socket.io | WebSocket + fallback polling для чата и заказов |
| Аутентификация | NextAuth.js v5 | JWT, httpOnly cookies, TTL 4 часа |
| Push-уведомления | Web Push API (VAPID) | Без Firebase — данные строго в РФ |
| Валидация | Zod | Схемы для всех API-входов (15+ схем) |
| PWA | next-pwa | Service Workers, офлайн-режим, install prompt |
| Деплой | Beget VPS + Nginx + PM2 | SSL, reverse proxy, автоперезапуск |
Хронология проекта
01
20–25 марта
Фундамент: Prisma-схема (11 моделей), NextAuth v5, маршруты и роли (~30 коммитов)
02
26 марта — 5 апреля
PWA-клиент: меню, корзина, заказы, Socket.io real-time, Web Push (~60 коммитов)
03
6 апреля
Дизайн-спринт: 32 коммита за 1 день — Figma → код, Hero, анимации, SVG-рамка, логотип
04
7–9 апреля
Мобильная адаптация: iOS safe-area, PWA install prompt, платёжный флоу (~25 коммитов)
05
10–16 апреля
Чат + безопасность: 4 цикла security audit, CSP ужесточён, rate limit, DB-индексы (~58 коммитов)
06
17–20 апреля
Kanban-дашборд, аналитика, Telegram-уведомления о новых заказах (~10 коммитов)
07
21–27 апреля
Прод-стабилизация: Samsung Galaxy Tab landscape, iOS safe-area landscape, финальный деплой PM2
Что мы сделали
Проектирование архитектуры: 11 моделей БД, 31 API-эндпоинт, система ролей (client / staff / manager / superadmin)
PWA-приложение с офлайн-режимом (Service Worker, CacheFirst 7 дней), баннер «Добавить на главный экран» для iOS и Android
Real-time система заказов на Socket.io с авторизованными комнатами и fallback-polling при разрыве
Встроенный чат клиент↔персонал с счётчиком непрочитанных и быстрыми шаблонами ответов
Оплата через статичный СБП QR — нулевая комиссия платёжного шлюза
Web Push API (VAPID) без Firebase — уведомления о новых заказах на iOS 16.4+ и Android
Kanban-дашборд с KPI-карточками, звуковыми уведомлениями и кнопкой «Остановить приём»
CRUD-редактор меню с автоконвертацией фото в WebP через sharp, стоп-лист одним кликом
Аналитика: выручка, средний чек, топ-блюда за произвольный период (только для manager+)
4 цикла security audit: CSP, rate limiting, Zod-валидация (15+ схем), httpOnly JWT, bcrypt 12 rounds
Адаптивность: iPhone 375px → Samsung Galaxy Tab A7 landscape 1280px с iOS safe-area
Деплой: Beget VPS + Nginx + PM2 + SSL, автоперезапуск при сбое