Web Cinema

Современный онлайн-кинотеатр с высокой производительностью и удобным интерфейсом

---

Содержание

• О проекте
• Технологический стек
• Архитектура
• Структура проекта
• Быстрый старт
• Команды
• Документация

---

О проекте

Проблема

Многие современные платформы для просмотра видео перегружены лишними элементами, имеют медленный интерфейс и сложную навигацию, что мешает пользователю просто наслаждаться контентом.

Решение

Web Cinema — это легкий и быстрый онлайн-кинотеатр. Мы сфокусировались на UX: плавные анимации, мгновенный поиск, удобный плеер и адаптивность под любые устройства. Использование Next.js 16 и React 19 обеспечивает максимальную производительность.

---

Архитектура

flowchart TD
    subgraph Client["Клиент (Browser)"]
        UI["React 19 Components"]
        Hooks["Custom Hooks"]
        Tailwind["Tailwind CSS 4"]
    end

    subgraph Server["Next.js Server (App Router)"]
        API["API Routes / Server Actions"]
        Middleware["Auth Middleware"]
        SSR["Server-Side Rendering"]
    end

    subgraph Data["Слой данных"]
        Prisma["Prisma ORM"]
        DB[(PostgreSQL)]
    end

    Client <--> API
    API <--> Prisma
    Prisma <--> DB
    SSR <--> Prisma

Loading

---

Быстрый старт

Требования

Компонент	Минимум	Рекомендуется
Node.js	20.x	22+
pnpm	9.x	9+
PostgreSQL	15+	16+

Установка

1. Клонируйте репозиторий:

git clone https://github.com/your-username/web.cinema.git
cd web.cinema

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

cd app/frontend
pnpm install

3. Настройте базу данных:

# Скопируйте .env и укажите DATABASE_URL
cp .env.example .env
pnpm prisma db push

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

pnpm dev

---

Команды

# Запуск в режиме разработки
pnpm dev

# Сборка проекта
pnpm build

# Запуск production-версии
pnpm start

# Проверка линтером
pnpm lint

# Генерация клиента Prisma
pnpm prisma generate

# Открытие Prisma Studio (интерфейс БД)
pnpm prisma studio