Клиентские системы я показать изнутри не могу — там живые данные: гости, ученицы, платежи, переписка. А этот сайт мой, и его можно разобрать целиком: что снаружи, что внутри, из чего собрано и почему именно так. Заодно видно, что тем же самым я пользуюсь сам, а не только продаю.
1человек: дизайн, фронтенд, бэкенд, тексты
0конструкторов и внешних CMS
~4дня от пустой папки до боевого домена
Снаружи
01
Что видит посетитель
Главная. Первый экран во всю высоту, список работ, блок обо мне с честными цифрами, отзывы и форма заявки. Светлая тема по умолчанию, тёмная — по выбору посетителя.
Страницы кейсов. Задача, что сделано, стек, результат — по одному шаблону, но собираются из данных, а не лежат отдельными файлами.
Страница услуги. Отдельная посадочная под CRM: боль, состав системы, интеграции, стоимость владения.
Правовая часть. Оферта, политика обработки данных, согласие, страница о cookie. Формы не отправляются без отметки о согласии, и проверяет это сервер, а не только галочка в вёрстке.
Приём заявок. Заявка уходит в панель и приходит уведомлением на телефон. Форма защищена ловушкой для ботов, ограничением частоты и reCAPTCHA v3.
Внутри
02
Панель управления
Ровно та панель, которую я ставлю клиентам. Ниже — настоящие экраны, не макеты.
Тексты сайта правятся полями, а не в коде. Пустое поле возвращает то, что записано в файле страницы, — сломать вёрстку правкой нельзя.Кейсы — не файлы, а данные. Один источник питает три представления: список на главной, страницу-хаб и саму страницу кейса. Новый проект заводится скрытым, публикуется одной кнопкой.Медиатека: загруженное фото само становится WebP, описание alt живёт вместе с файлом и подставляется везде, где фото стоит. Занятый кадр не даст себя удалить — видно, на каких страницах он используется.С телефона панель работает целиком, а не «просмотром»: меню уезжает в выдвижной ящик, подписи кнопок заменяются иконками, поля не мельчат — iOS не зумит форму при вводе.
Заявки. Статусы «новая → в работе → закрыта», заметка для себя, телефон и Telegram ссылками — со смартфона звонок в одно касание.
Отзывы. Приходят с сайта на модерацию: сами на страницу не попадают, текст можно поправить перед публикацией.
Уведомления. Push на телефон о новой заявке и отзыве — без своего приложения в сторах.
Как
03
Как это устроено
Дизайн живёт в файлах, правки — в базе. Панель хранит только изменённые поля и накладывает их при отдаче страницы. Пустая база — сайт выглядит ровно как в исходниках. Это значит, что правка из панели не может «увести» дизайн.
Свой код, без конструкторов. Node.js и обычный HTML с CSS, без сборщиков и фреймворков. Страница весит килобайты, а не мегабайты, и открывается быстро на слабом телефоне.
SEO — часть системы, а не «потом». robots и карта сайта генерируются из тех же данных, что и страницы: добавили проект — он сам появился в карте. Пока не задан боевой домен, сайт закрыт от индексации, чтобы в поиск не попал временный адрес.
Данные не теряются. Копии контента снимаются при старте и раз в сутки, старые чистятся сами — бэкапы не должны однажды забить диск, я это уже проходил.
Запуск. Systemd поднимает сервис и перезапускает при сбое, nginx отдаёт HTTPS, сертификат продлевается сам. Обновление — одна команда, контент при этом не трогается.
Зачем
04
Что это значит для вас
Вы видите товар до покупки. Не «сделаем панель управления», а вот она — со всеми экранами, включая телефон.
Правки без разработчика. Поменять текст, заменить фото, добавить проект, снять отзыв с публикации — это работа на минуту, без письма мне и без ожидания.
Сайт принадлежит вам. Никакой абонплаты за панель и лимитов на страницы. Код после оплаты ваш, вести систему может кто угодно.
Так же собирается ваш проект. Разница только в наборе разделов: у отеля добавляются брони и загрузка, у школы — курсы и оплаты, у мастера — запись и напоминания.