Деплой и что дальше

Доводим проект до живого сайта в интернете и намечаем, что учить дальше.

Деплой Next.js — это сборка (next build) и запуск на хостинге; самый простой путь — Vercel (создатели Next.js), но подойдёт любая платформа с Node.js или Docker.

Продакшен-сборка

Перед деплоем код собирают в оптимизированный билд. Команда build заодно подсветит ошибки типов и покажет размеры бандлов:

npm run build
npm run start

next build создаёт папку .next с готовым приложением (статика, серверные функции), а next start запускает её как продакшен-сервер.

Деплой на Vercel

Самый быстрый сценарий: подключить git-репозиторий к Vercel. Дальше платформа сама собирает проект на каждый push:

Важно: переменные из локального .env на прод не уезжают автоматически — их задают в настройках хостинга.

Другие платформы

Next.js не привязан к Vercel. Приложение можно запустить на любом сервере с Node.js (next start) или в Docker-контейнере; часть проектов экспортируют как полностью статический сайт. Принцип тот же: build, затем запуск.

Чеклист готовности к проду

const checklist = [
  { item: "next build проходит без ошибок", done: true },
  { item: "переменные окружения заданы на хостинге", done: true },
  { item: "секреты без префикса NEXT_PUBLIC_", done: true },
  { item: "домены картинок в remotePatterns", done: true },
];

const ready = checklist.every((c) => c.done);
console.log("Готово пунктов:", checklist.filter((c) => c.done).length + "/" + checklist.length);
console.log("Можно деплоить:", ready);

Вывод:

Готово пунктов: 4/4
Можно деплоить: true

Что дальше

• Углубить рендеринг: стриминг, Suspense, частичная пререндеринг.
• Данные: Prisma/Drizzle, кэш-теги, оптимистичные обновления.
• Аутентификация: Auth.js, защита маршрутов через middleware.
• Тесты и мониторинг: Playwright, аналитика Web Vitals на проде.

Итог

• Деплой = next build + запуск; на Vercel это происходит автоматически на push.
• Переменные окружения задают в настройках хостинга, а не из локального .env.
• Дальше — стриминг, работа с БД, аутентификация, тесты и мониторинг.