Bleyzos Stremasik — видеоплатформа нового поколения

Друзья, хочу поделиться проектом над которым работал. Это не просто видеохостинг — это полноценная медиаплатформа с нуля.
Что внутри:
Стек: Next.js 14 + React + TypeScript + Tailwind CSS + Google Material Design UI Kit. Бэкенд на Node.js с API routes. База данных — JSON-файлы (для старта, потом миграция на PostgreSQL). Docker для деплоя.
Фичи которые реально работают:
Авторизация и безопасность. JWT токены, httpOnly cookies, rate limiting на все эндпоинты (регистрация 5/мин, логин 10/мин, загрузка 3/5мин). Защита от XSS, CSRF, SQL инъекций. CSP заголовки, X-Frame-Options, HSTS. Система ролей: owner → admin → moderator → user. Пароль минимум 10 символов с валидацией.
Видео. Загрузка MP4, WebM, MOV файлов до 2ГБ. HLS транскодирование через ffmpeg — видео автоматически разбивается на сегменты для адаптивного воспроизведения. Выбор качества: 144p до 1440p. Signed URLs для защиты от скачивания. Защита от правой кнопки и DevTools.
Каналы. Каждый пользователь создаёт канал. Страница канала с баннером, аватаром, статистикой. Подписки и отписки работают. Видео привязаны к каналам.
Shorts. Вертикальный плеер. Свайп вверх-вниз, навигация стрелками и клавиатурой. Лайки, комментарии, подписки — всё работает.
Студия. Управление видео, плейлисты, аналитика канала. Загрузка с выбором типа: обычное видео или Shorts.
Поиск. Полноценный поиск по названию, жанру, году. Фильтры по категориям.
Админ-панель. Дашборд со статистикой. Управление пользователями (поиск, редактирование ролей, удаление). Жалобы и отзывы. Аналитика с графиками. Owner имеет root-доступ.
Настройки. Сохраняются в базу. Автовоспроизведение, субтитры, уведомления, конфиденциальность. Смена пароля.
UI/UX. Google Material Design 76 компонентов. Адаптивность: десктоп, планшет, телефон. Bottom Nav на мобильных. Боковая панель на десктопе. Skeleton загрузки, пустые состояния, баннеры ошибок.
Анти-защита. Rate limiting по IP. Anti-boost для лайков (5/мин). Защита от скачивания видео. CSP, CORS, HSTS заголовки. XSS и SQL инъекция проверка.
Стек технологий:
- Frontend: Next.js 14, React 18, TypeScript, Tailwind CSS
- Backend: Node.js, API Routes, JWT (jose)
- UI: Google Material Design 76 компонентов
- Видео: ffmpeg, HLS, signed URLs
- Безопасность: bcryptjs, rate limiting, CSP, anti-boost
- Деплой: Docker + docker-compose
- База: JSON (миграция на PostgreSQL планируется)
Что дальше:
- HLS.js для адаптивного стриминга в реальном времени
- Рекомендательный алгоритм
- Реальные уведомления
- WebSocket для чата
- Миграция на PostgreSQL + Redis кеш
- Мобильное приложение (React Native)
Проект открыт для коллаборации. Если интересно — пишите, обсудим архитектуру.
#программирование #веб #nextjs #видеоплатформа #docker #typescript