67/apps/web

ДГТУ МЕДИА

Frontend MVP информационной системы управления медиаконтентом университета. Проект выполнен на JavaScript/JSX, React, Vite и Tailwind CSS.

Запуск

Требуются Node.js 22+ и npm.

Из корня монорепозитория:

npm install
npm run dev

Для запуска только frontend:

npm run dev:web

Откройте http://localhost:5173. В dev-режиме Vite проксирует /api на http://localhost:3000.

Проверки

npm --workspace @fable/web run lint
npm --workspace @fable/web run test
npm --workspace @fable/web run build

Структура

src/
  app/          маршрутизация, layouts и состояние сессии
  pages/        публичные страницы и ролевые кабинеты
  shared/
    api/        Axios-клиент и общая обработка ошибок
    data/       реалистичные mock-данные
    lib/        небольшие общие helpers
    ui/         переиспользуемые компоненты

В DESIGN.md описаны дизайн-токены, визуальный характер, правила компонентов и анимаций.

Реализованные страницы

• главная редакционная страница;
• каталог с поиском и фильтрами через URL;
• страница материала;
• афиша событий;
• медиаканалы: радио, журналы и социальные сети;
• страница о медиапортале;
• вход и тестовые роли;
• профиль пользователя;
• кабинет редактора и форма материала;
• очередь модератора;
• статистика и пользователи администратора;
• страницы 403 и 404 с SVG-анимацией.

Тестовые роли

Основной demo-вход: demo_admin / demo_password.

Роль	Учётная запись
Пользователь	user@dstu.ru
Редактор	editor@dstu.ru
Модератор	moderator@dstu.ru
Администратор	admin@dstu.ru

Роль также можно переключить в шапке кабинета для демонстрации интерфейсов.

Ожидаемые backend endpoints

• POST /auth/login, POST /auth/refresh, POST /auth/logout;
• GET/PATCH /users/me;
• CRUD /materials, /categories, /tags, /events;
• /materials/:id/comments, /subscriptions, /notifications;
• /moderation/queue, /moderation/:id/approve, /moderation/:id/return;
• /admin/users, /admin/stats, /admin/audit-log;
• POST /uploads.

Адрес API можно переопределить через VITE_API_URL. По умолчанию интерфейс работает с /api и ожидает gateway на localhost:3000.

Безопасность зависимостей

Проект закреплён на pnpm 11. В pnpm-workspace.yaml включены:

• minimumReleaseAge: 1440;
• blockExoticSubdeps: true;
• trustPolicy: no-downgrade;
• явный allowBuilds только для esbuild и @tailwindcss/oxide.

Lockfile необходимо хранить в репозитории.

Ограничения MVP

• данные backend по-прежнему демонстрационные и в основном живут в in-memory store;
• внешние изображения загружаются с Unsplash;
• график администратора демонстрационный.