← Все работыСайт на Next.js с CMS · Заказная разработка

Сайты, где каждая заявка знает, откуда пришла

Сайт студии, на котором вы сейчас находитесь: сайт на Next.js и Payload CMS на двух языках, с услугами, кейсами с живыми демо-стендами, блогом по расписанию и заявками, которые уходят в CRM вместе с источником. Кейсы и статьи правятся в админке без разработчика.

Как это выглядит

Снимки этого сайта — того, на котором вы сейчас находитесь.

Главная: 3D-сцена на three.js подстраивается под экран и не мешает читать.
Форма заявки: вместе с текстом уходят страница, язык и метки, откуда пришёл человек.
Блог: статьи выходят из очереди по расписанию, без ручного «опубликовать».

Что на самом деле сложно, когда строишь «сайт на Next.js с CMS»

Сайт студии разработки — странный заказ. Это одновременно витрина, доказательство и источник заявок, и в каждой из этих ролей его судят строже, чем сайт любого другого бизнеса. Покупатель программного обеспечения смотрит не только на тексты, но и на то, как сделано: открываются ли демо, не разваливается ли страница на телефоне, названы ли цены. Но главная проблема почти любого корпоративного сайта снаружи не видна. Заявка пришла — а откуда? С какой страницы, на каком языке, по какой рекламе? Если сайт этого не знает, решения о том, какие страницы писать и какие услуги продвигать, принимаются наугад. А если заявку можно отправить в обход сайта, в CRM попадает мусор, и отличить настоящую заявку от поддельной уже нельзя. Есть и третий вопрос, о котором вспоминают последним: что происходит с заявкой, если CRM в эту минуту недоступна. К этому добавляется обычное для живого сайта: контент меняется постоянно, статьи должны выходить по плану, а не когда у разработчика нашлось время, и всё это — на двух языках.

Где в этом продукте прячется работа

Заявка знает, откуда пришла

Путь страницы, с которой отправили форму, берётся из заголовка Referer, язык выводится из этого пути, а метки UTM очищаются перед записью. Вместе с каждой формой уходят пять меток UTM, источник перехода, путь страницы, сама форма, услуга и кейс. В CRM приходит не просто «новая заявка», а заявка со страницы конкретной услуги, на конкретном языке, из конкретной кампании. Важная деталь — кривое значение не ломает заявку: если заголовок пустой или метка испорчена, поле становится пустым, а заявка доходит. Потерять клиента из-за неправильной метки было бы худшим из возможных исходов.

Заявки пишет только сервер

Создание заявки через публичный REST закрыто: записать её может только сервер сайта. Подделать заявку снаружи, отправив запрос в обход страницы, нельзя. Для сайта, который передаёт заявки в CRM, это не мелочь: иначе любой, кто нашёл адрес, мог бы наполнить воронку продаж чем угодно, а менеджеры тратили бы время на то, чего не было.

Заявка доходит до CRM, даже если CRM недоступна

Посетитель отправил форму — ответ он должен получить сразу, что бы ни происходило с CRM. Поэтому сама запись заявки на сайте и есть очередь: заявка сохраняется со статусом «ожидает», посетитель получает ответ, и только после этого сайт пробует отправить её в CRM. Не вышло — раз в 60 секунд отдельный проход перебирает заявки, которые ещё ждут. На каждую попытку отведено не больше 10 секунд, пауза между попытками начинается с 30 секунд и удваивается до часа, а если CRM сама попросила подождать, сайт ждёт столько, сколько она сказала. Чтобы одна заявка не ушла дважды, на время отправки она закрепляется за одним отправителем, а если повтор всё же случится, CRM узнаёт заявку по её номеру и второй раз её не заводит.

3D-сцена, которая не мешает читать

На главной — сцена на three.js: куб из шариков превращается в сферу, а по связям между шариками бегут импульсы. Красивая сцена на слабом устройстве — это тормозящая главная и ушедший посетитель. Поэтому сцена проверяет аппаратное ускорение и подстраивает масштаб под экран: украшение не должно стоить посетителю медленной страницы.

Статьи выходят по расписанию из очереди

Блог живёт по плану: статьи пишутся заранее и выходят по расписанию из очереди, без человека, который в нужный день нажимает «опубликовать». Правило простое: статья видна на сайте, только когда она опубликована и её дата публикации уже наступила. Поэтому поставить статью в очередь — значит просто выбрать дату. Для сайта, который зарабатывает поиском, ритм публикаций — часть работы, а не настроение редакции, и держать его должна система, а не чья-то память.

Демо, которое не утяжеляет страницу

Разборы на этом сайте открываются вместе с живыми демо-стендами — их 7, и это работающие интерфейсы на вымышленных данных, а не видео и не скриншоты. Грузить стенд вместе со страницей значило бы заставить каждого посетителя платить за то, что откроет не каждый. Поэтому стенд загружается по клику. А на самом стенде прямо написано, что данные вымышленные и интерфейс воссоздан по проекту: посетитель трогает продукт и знает, что именно он трогает.

Один текст — для человека и для поиска

Вопросы покупателя на странице разбора и разметка FAQPage для поисковиков собираются из одних и тех же данных в CMS, поэтому разойтись не могут. По той же причине у разбора два заголовка в разных полях — на экране и для выдачи: на экране работает образ, в выдаче — то, что ищут. Оба правятся в админке, а не в коде.

Как мы за это взялись

Этот сайт — наш собственный, и мы относимся к нему как к продукту, а не к визитке. Главным в нём мы считали невидимое: заявку, которая знает свой источник, заявки, которые может записать только сервер, и доставку в CRM, которая переживает недоступность CRM. Без этого сайт — открытка, а не канал продаж.

Контент, который меняется чаще всего, лежит в Payload CMS: в ней пять коллекций — заявки, медиафайлы, статьи, кейсы и пользователи. Кейсы и статьи правятся в админке без разработчика, статьи выходят из очереди по расписанию, а у каждого разбора есть свой демо-стенд — посетитель может потрогать продукт до первого созвона, а не верить на слово.

Видимое мы делали так, чтобы оно не мешало: 3D-сцена на главной проверяет аппаратное ускорение и подстраивает масштаб под экран, чтобы украшение не стоило посетителю медленной страницы.

Сайт живёт и меняется. Первый коммит — 15 сентября 2025 года, сейчас их больше 600: 50 в 2025 году, остальные — в 2026-м. В коде сайта больше 22 000 строк на TypeScript, схема базы меняется миграциями — их 10, а сквозных тестов в браузере больше 50. Этот разбор — тоже часть сайта.

Больше 600

коммитов с сентября 2025: 50 в 2025 году, остальные — в 2026-м

2 языка

русская и английская версии сайта

Больше 50

сквозных тестов в браузере, по исходникам

живых демо-стендов на вымышленных данных

От 30 секунд до часа

растёт пауза между повторами, если CRM недоступна, — заявка ждёт, а не теряется

Только сервер

пишет заявки — создание через публичный REST закрыто

Next.js 16Payload 3PostgreSQLthree.jsTypeScript

Из чего он собран

Из каких услуг он собран и сколько это стоит

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

от 600 000 ₽

Начинается от

восемь недель до первой рабочей версии

Первая рабочая версия

Это первая рабочая версия с одним сквозным сценарием: например, страницы в CMS и заявка, которая доходит до CRM с источником. Второй язык, блог с очередью публикаций и демо-стенды — следующие этапы со своей ценой. Если нужна страница-визитка, это другой продукт: его быстрее и дешевле соберут из готовых блоков.

Что спрашивают про такие продукты

Пять вопросов, которые звучат почти на каждом первом созвоне.

Конструктор хорош, пока сайт — это страницы с текстом. Когда заявки должны уходить в CRM с источником, статьи — выходить по расписанию, а на страницах кейсов — открываться живые демо, нужен код, который вы контролируете. Next.js и Payload CMS дают и то и другое: код остаётся вашим, а контент правится в админке без разработчика.

Да. Кейсы и статьи лежат в CMS и правятся в админке. Статью можно поставить в очередь: она появится на сайте сама, когда наступит её дата публикации.

Сайт сам записывает это в заявку: путь страницы берётся из заголовка Referer, язык — из пути, метки UTM очищаются, а вместе с ними уходят форма, услуга и кейс. Если значение испорчено, поле остаётся пустым, а заявка всё равно доходит. В CRM заявка приходит уже с источником.

Ничего страшного: заявка сначала сохраняется на сайте, посетитель сразу получает ответ, а отправка в CRM повторяется сама — с паузой, которая растёт от 30 секунд до часа. Дважды одна заявка в CRM не попадёт: CRM узнаёт её по номеру.

Сайт, который работает как система — CMS, заявки в CRM с источником, блог по расписанию, — мы считаем как веб-разработку: от 600 000 ₽ и восемь недель до первой рабочей версии с одним сквозным сценарием. Если нужен лендинг на одну страницу, это другой продукт, и дешевле его соберут из готовых блоков.

Глубже по теме

Корпоративный портал: что это и почему главная работа в нём — права доступа
Новости и телефонный справочник — простая часть портала. Работа начинается, когда в нём появляются заявки, согласования и вопрос, кто какие документы вправе видеть. Разбираем, что входит в первую версию и когда хватит готового.
Сколько займёт разработка приложения и почему сроки уезжают
Первый релиз приложения на iOS и Android — восемь недель, если в нём один сценарий, а решения не ждут неделями. Разбираем, что делает срок длиннее, почему он уезжает и какой приём держит график лучше любого штрафа в договоре.
Приёмка программного обеспечения: что входит в передачу проекта и что записать в акт
Самый частый способ попасть в зависимость от подрядчика — невнятная передача. Приёмка программного обеспечения от неё защищает, если принимать систему на своём сервере, а не демонстрацию.
Своя разработка или готовая коробка: как выбрать за неделю
Мы регулярно отговариваем от заказной разработки, и вот по каким признакам. Плюс тест на пять минут, который отвечает на вопрос до всяких сравнений.

Следующий разборМагазины запчастей, где номер детали можно написать как угодноМагазин запчастей для розницы и оптовиков: поиск по номеру детали с аналогами и заменами, цена под группу покупателя, гараж клиента и кабинет, куда поставщики сами загружают прайсы. Разбор для тех, кто думает, как открыть интернет-магазин автозапчастей, и хочет понять, где в нём настоящая работа.

Расскажите, что нужно сделать

Расчёт придёт за 12 часов: цена от и до, из чего она сложилась и что её двигает. Не хватит данных — вопросы придут в те же 12 часов.