Next.js-приложение с серверным рендерингом можно разместить в России на Татнет: платформа соберёт проект и запустит его как Node.js-сервер. Ниже — небольшой каталог, который мы действительно развернули и проверили снаружи.

Открыть работающее демо · Исходный код на GitHub · Посмотреть JSON API

В примере есть App Router, серверный поиск, страницы инструментов и Route Handler. База данных и секреты не нужны: шесть записей находятся в исходном коде. Это позволяет повторить запуск, не подключая дополнительные услуги.

Что именно работает на сервере

Главная страница — серверный компонент. В начале обработки она вызывает connection(), чтобы Next.js формировал ответ при запросе, а не во время сборки.

На странице показаны время генерации и случайный ID. Обновите её: оба значения изменятся. Поиск и категория передаются через обычную GET-форму. Например, /?q=React оставляет в каталоге Next.js, а фильтр «Данные» — PostgreSQL и Valkey.

Сервер сразу возвращает HTML с отфильтрованными карточками. Форма и прямые ссылки работают с отключённым JavaScript. Отдельный маршрут /api/tools возвращает тот же каталог в JSON; страница не делает HTTP-запрос к собственному API — оба маршрута используют общую функцию из lib/catalog.ts.

АдресЧто проверяет
/Серверный рендеринг на каждый запрос
/?q=ReactПоиск на сервере, результат уже в HTML
/tools/nextjsПрямая ссылка на карточку и её metadata
/api/tools?q=ReactRoute Handler, JSON и Cache-Control: no-store
/api/healthДоступность приложения
/tools/missing-exampleОтвет 404 для неизвестной карточки

1. Склонируйте Next.js-проект и проверьте его локально

Нужны Git, Node.js 22 или новее и Bun 1.4 или новее. На момент публикации пример использует Next.js 16.4.2 и React 19.3.1. Конкретные версии находятся в package.json, зависимости зафиксированы в bun.lock.

git clone https://github.com/tatnet-ru/nextjs-example.git
cd nextjs-example
bun install --frozen-lockfile
bun test
bun run build
bun run typecheck
bun run start

Откройте http://localhost:3000. Для разработки вместо production-сборки можно использовать bun run dev.

Если хотите создать Next.js-проект с нуля, а не брать пример, начните с npx create-next-app@latest: шаблон на React и App Router собирается и запускается теми же шагами, что описаны ниже.

В проекте нет загрузки шрифтов с Google или запросов к внешним API. Bun нужен для установки пакетов и запуска скриптов; собранное приложение работает на Node.js.

2. Подготовьте аккаунт и проект Татнет

Зарегистрируйтесь в панели Татнет, создайте проект или выберите существующий. Создайте API-ключ и авторизуйте CLI Татнет:

npx tatnet@latest auth login

Вводите ключ в запрос CLI, не добавляйте его в репозиторий или команды статьи. Если CLI уже установлен, используйте tatnet auth login.

3. Опубликуйте локальные исходники

В этой инструкции использован деплой из папки. В каталоге склонированного проекта выполните следующую команду, заменив MY_PROJECT на имя или ID своего проекта:

npx tatnet@latest deploy . \
  --project MY_PROJECT \
  --name my-nextjs-demo \
  --framework nextjs \
  --install-command 'bun install --frozen-lockfile' \
  --build-command 'bun run build' \
  --output-directory .next

Команда создаст приложение, загрузит исходники, дождётся сборки и выведет его HTTPS-адрес. Папки .git, node_modules и служебная .tatnet не загружаются. Правила .gitignore исключают .next и локальные файлы окружения.

Фреймворк nextjs важен: проекту нужен сервер, а не раздача статического экспорта. Если output не задан, платформа включает standalone-сборку. Ручная установка Nginx, PM2 и сертификата для выданного поддомена не требуется.

CLI сохраняет привязку приложения в .tatnet/project.json. Следующий tatnet deploy из этой папки обновит тот же экземпляр. Не коммитьте служебную папку — в примере она уже добавлена в .gitignore.

Деплой из папки не подключает автоматические обновления из GitHub. Публичный репозиторий служит исходником для воспроизведения. Если нужен деплой на каждый push, сделайте fork, подключите свой GitHub в панели и создайте приложение из репозитория: выберите ветку main, Next.js, Node.js 22 или 24, команды установки и сборки из примера. Это другой способ доставки исходников; наше публичное демо опубликовано через CLI.

4. Убедитесь, что работает сервер, а не только главная

Самый короткий способ — smoke-проверка из репозитория. Передайте адрес своего приложения вместо адреса нашего демо:

bun run smoke https://nextjs-example.tatnet.app

Скрипт делает запросы к главной, поиску, карточке, API и health endpoint. Он проверяет HTTP-статусы, наличие ID SSR-ответа в HTML, его изменение между запросами, фильтрацию, no-store у API и ответ 404 для неизвестной карточки. Браузерный JavaScript при такой проверке вообще не выполняется.

Те же адреса можно проверить вручную:

curl -fsS 'https://nextjs-example.tatnet.app/api/health'
curl -fsS 'https://nextjs-example.tatnet.app/api/tools?q=React'
curl -I 'https://nextjs-example.tatnet.app/tools/missing-example'

У /api/health ожидается status: "ok". В JSON поиска — одна запись nextjs. При повторном запросе меняется requestId. Неизвестная карточка возвращает HTTP 404. Эти проверки прошли на опубликованном демо 21 октября 2026 года.

Сколько стоит такой запуск

У Татнет Apps есть бесплатный тариф для первого запуска на поддомене *.tatnet.app с HTTPS и бейджем платформы. Свой домен и preview доступны на платных тарифах — актуальные цены и состав каждого тарифа смотрите на странице тарифов.

Тариф — это фиксированная часть счёта, а не обещание итоговой суммы при любой нагрузке: потребление сверх включённого объёма оплачивается отдельно, ставки — там же, на странице тарифов. База данных и регистрация домена в этот пример не входят и для его запуска не нужны.

При scale-to-zero первый запрос после простоя может ждать запуска приложения. Если приложение должно работать постоянно, учитывайте стоимость постоянно работающей реплики. По учебному каталогу нельзя оценить счёт или скорость ответа вашего проекта: его нужно проверить на собственных данных и нагрузке.

Что этот пример не проверяет

Каталог подтверждает работу SSR, App Router, Route Handlers и Node.js runtime для конкретного проекта. Здесь нет авторизации, Server Actions, оптимизации изображений, базы данных, ISR и распределённого кэша. Пример не является нагрузочным тестом или проверкой всей совместимости Next.js.

В рабочем приложении храните пользовательские данные во внешней базе или объектном хранилище. Локальные данные экземпляра и его кэш могут исчезнуть при перезапуске. На Татнет кэш ISR и on-demand revalidate ограничен живым экземпляром; это нужно учитывать при переезде с Vercel.

Подключение приложения к постоянным данным разобрано отдельно: Managed PostgreSQL в приватной сети и Valkey для кэша и сессий.

Начать можно с работающего каталога, затем открыть репозиторий с README и тестами. Возможности платформы для фреймворка собраны на странице «Хостинг Next.js в России».