Кейс · Веб-приложение
Bad Club: бронирование мест в игровом коворкинге
Демо-приложение на Vue 3 и Express с SQLite: интерактивная карта зала с бронированием мест, личный кабинет и админ-панель с редактором расстановки. Вход без паролей, по одноразовому коду на e-mail.
- Vue 3
- Vite
- Pinia
- Vue Router
- GSAP
- Express
- node:sqlite
- JWT (httpOnly cookie)
- Resend
01 · Как выглядит
Скриншоты
02 · О проекте
Что это и зачем
Демо-приложение на Vue 3 и Express с SQLite: интерактивная карта зала с бронированием мест, личный кабинет и админ-панель с редактором расстановки. Вход без паролей, по одноразовому коду на e-mail.
Ограничения
Демо-проект, нигде не развёрнут; продакшена и реальных клиентов нет.
Скриншоты сняты на чистой базе с сид-данными; занятые места на карте создаёт сид, это не реальные брони.
Без ключа почтового сервиса код входа печатается в консоль сервера.
Автотестов в проекте нет.
Что внутри
- Карта зала с зонами (обычные, тихая, VIP, два монитора), фильтром по типу и статусом мест
- Админ-панель: обзор, брони, столы, компьютеры, пользователи и перетаскиваемая расстановка зала
- Вход по OTP с ограничением попыток и частоты запросов, роль admin задаётся через переменную окружения
- Данные для демо создаются сид-скриптом при первом запуске
03 · Как запустить
Запуск одной командой
npm install && npm run dev
# backend :3001, frontend :5173; прод-режим: npm run build, затем NODE_ENV=production npm start (JWT_SECRET и ADMIN_EMAILS в backend/.env)04 · Код
Репозиторий приватный
Исходники лежат в приватном репозитории. Открою доступ по запросу: напишите, и пришлю приглашение.
Запросить код