Tuleneva Rehearsal Studio Booking App

Telegram Mini App для бронирования времени в репетиционной студии "Тюленева 25".

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

Frontend:

• React + TypeScript
• Vite (сборщик)
• Telegram Apps SDK (интеграция с Telegram)
• React Router (маршрутизация)
• CSS Modules (стилизация)

Backend:

• Node.js + Express
• MongoDB + Mongoose
• Telegraf (Telegram Bot API)
• JWT (авторизация)

✨ Функционал

Для пользователей:

• 📅 Просмотр расписания: Календарь с отображением занятых и свободных слотов.
• 📝 Бронирование: Возможность забронировать свободное время (для авторизованных пользователей).
• ❌ Отмена бронирования: Возможность отменить свою репетицию.
• 🔐 Авторизация: Автоматический вход через Telegram с валидацией данных (initData).

Роли и доступ:

• Guest: Может только просматривать расписание. Бронирование недоступно до подтверждения администратором.
• User: Может бронировать время и отменять свои брони.
• Admin: Полный доступ. Может бронировать и отменять любые репетиции, управлять пользователями.

Админ-панель (только для Admin):

• 📋 Список пользователей: Просмотр всех зарегистрированных пользователей.
• ✏️ Управление ролями: Изменение роли пользователя (guest -> user -> admin).
• 🗑️ Удаление пользователей: Возможность удалить пользователя из базы.

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

Предварительные требования

• Node.js (v18+)
• MongoDB (запущенная локально или облачная)

1. Клонирование репозитория

git clone <repository-url>
cd tuleneva

2. Настройка Бэкенда (Server)

Перейдите в папку сервера:

cd server

Установите зависимости:

npm install

Создайте файл .env в папке server и добавьте необходимые переменные окружения:

TELEGRAM_TOKEN=ваш_токен_бота
TELEGRAM_ADMIN_ID=ваш_telegram_id_для_уведомлений
JWT_SECRET=секретный_ключ_для_jwt
PORT=3000

Запустите сервер:

npm start
# или для разработки
npm run dev

Сервер будет доступен по адресу http://localhost:3000.

3. Настройка Фронтенда (Client)

Вернитесь в корень проекта:

cd ..

Установите зависимости:

npm install

Запустите клиент в режиме разработки:

npm run dev

Приложение будет доступно по адресу, указанному в консоли (обычно https://localhost:5173 или https://tuleneva.local если настроено).

Примечание: Для корректной работы Telegram Apps SDK и авторизации локально, приложение эмулирует среду Telegram, если запущено в браузере.

📦 Сборка и деплой на production

Сервер (Backend)

1. В папке server выполните сборку:

   npm run build

   Это создаст файл server/dist/index.cjs.

2. На production сервер необходимо скопировать:

   • Папку server/dist
   • Файл server/package.json
   • Файл server/package-lock.json
   • Файл .env (в папку с сервером или на уровень выше)

3. На production сервере установите production-зависимости:

   npm install --omit=dev

4. Запустите сервер:

   node dist/index.cjs

   (Или используйте PM2: pm2 start dist/index.cjs)

Клиент (Frontend)

1. В корне проекта выполните сборку:

   npm run build

   Это создаст папку dist с статическими файлами.

2. Эти файлы можно раздавать любым веб-сервером (Nginx, Apache, и т.д.).

📡 API Эндпоинты

Авторизация

• POST /api/users/auth - Аутентификация через Telegram InitData. Выдает JWT.

Пользователи

• GET /api/users - Получить список всех пользователей (Требуется токен).
• PUT /api/users/:id/role - Изменить роль пользователя (Только Admin).
• DELETE /api/users/:id - Удалить пользователя (Только Admin).

Расписание и Бронирование

• GET /api/timetable?date=DD/MM/YYYY - Получить занятые даты месяца.
• GET /api/hours?date=DD/MM/YYYY - Получить слоты на конкретный день.
• POST /api/book - Забронировать время (Требуется токен).
• DELETE /api/cancel - Отменить бронирование (Требуется токен).

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

tuleneva/
├── server/                 # Бэкенд на Express
│   ├── models/             # Mongoose схемы (User, Rehearsal)
│   └── index.js            # Точка входа сервера
├── src/                    # Фронтенд на React
│   ├── api/                # Клиентские API функции
│   ├── components/         # React компоненты (Calendar, TimeSlots, Loader...)
│   ├── contexts/           # React Context (AuthContext)
│   ├── hooks/              # Кастомные хуки (useAuth, useTimeTableData)
│   ├── pages/              # Страницы (TimeTablePage, AdminPage)
│   └── types/              # TypeScript типы
├── vite.config.ts          # Конфигурация Vite
└── README.md               # Документация