Кейс · 2025 · каталог-сервис
Загляните в каталог автошкол изнутри
Реальные блоки сайта, его цвета и шрифт — всё, чтобы разобрать проект без скучных слайдов. Вы внутри кейса, собранного из самого avtoschool.by.
Ничего не найдено — попробуйте «карта» или «отзывы»
Собрать в одном месте всё, что нужно для выбора автошколы
avtoschool.by (на сайте — бренд «рулим.бел») — независимая платформа выбора автошколы и инструктора по вождению в Минске. Контент-сервис, агрегатор: не сайт одной школы, а каталог 100+ школ и инструкторов с реальными отзывами учеников, рейтингами, ценами по категориям, интерактивной картой и блогом.
Нужно было сделать это без шаблонов, чужих движков и SaaS-конструкторов: свой каталог с фильтрами, своя система отзывов с модерацией, личные кабинеты учеников и инструкторов, админ-панель и заявки на запись, которые уходят в Telegram. И с первого дня — по закону о персональных данных: всё хранится в Беларуси.
Брендбук
8 цветов · 1 гарнитураНажмите на цвет — покажем, где он работает на карточке автошколы из топа главной.
Единственный фирменный акцент. Логотип-руль, цена «от…», активный фильтр, пин на карте и главная кнопка «Записаться».
Подложка зелёных бейджей (с кантом #BBF7D0) и мягкий градиент хиро. Зелёный текст на мяте — «хорошая новость»: топливо включено, свой автодром.
Заголовки, названия школ, цифра рейтинга. Почти чёрный — и активная кнопка сортировки, чтобы не спорить с зелёными фильтрами районов.
Фон страницы и поля поиска. Светло-серый, на котором белые карточки читаются без тяжёлых теней.
Поверхности: карточки школ и инструкторов, шапка, попапы карты. Граница — 1px #E4E4E7.
Вторичный текст: район, подписи фильтров, даты. Карточка плотная, поэтому иерархия держится на сером, а не на размере.
Второй функциональный цвет: фильтр категорий, бейджи «Оплата частями» и «Теория онлайн», категория B. У метро — свои цвета линий.
Звезда рейтинга. У топ-3 — золотое, серебряное и бронзовое кольцо вокруг карточки и кружок с местом.
Сигнал-Драйв
Московский
Главная
поиск, быстрые фильтры, материалы
Страница школы
цены, метро, карта, запись
Карта
пины школ и линии метро
Каталог
районы, сортировка, категории
Инструкторы
стаж, школа, цена за час
Полезное
блог, Markdown в админке
Кликните, чтобы открыть живую картуИнтерактивная карта на Leaflet + MapLibre GL: пины с логотипами школ, три линии метро и привязка каждой школы к ближайшим станциям. На карточках станция подписана цветом своей линии — ориентир, понятный любому минчанину.
Функционал
13 в базеФильтры каталога
каталогРайоны, метро, категории A/B/C/D, цена, наличие автодрома, тип коробки, рассрочка.
Профили инструкторов
каталогПривязка к школам, опыт, цена за урок, фото автопарка.
Блог «Полезное»
каталогМатериалы для будущих водителей, Markdown прямо в админке.
Отзывы с модерацией
отзывыРейтинг и текст, защита от спама, лимит отзывов на пользователя.
Внешние рейтинги
отзывыОценки школ подтягиваются с Яндекс.Карт и Google Maps.
Личный кабинет
кабинетыДля учеников и инструкторов. JWT на HttpOnly-cookies, bcryptjs.
Админ-панель
кабинетыМодерация контента и заявок на запись.
Rate limiting
безопасностьНа критичных эндпоинтах: вход, регистрация, запись, отзывы.
Проверка файлов по magic bytes
безопасностьЗагружаемые файлы валидируются по содержимому, а не по заявленному MIME.
Закон № 99-З
закон РБДанные физически в РБ, без трансграничной передачи. Подробный документ согласия.
Журнал согласий
закон РБКаждое согласие фиксируется с версией документа, IP и user-agent.
SSR и schema.org
SEOEducationalOrganization, Person, Article, AggregateRating; динамический sitemap.xml.
Переезд домена без даунтайма
SEO301 со всех URL с сохранением путей, Change of Address в Google, главное зеркало в Я.Вебмастере.
Путь заявки
4 шагаКнопка «Записаться»
На странице школы или инструктора — одна зелёная кнопка
ЗаписатьсяФорма и согласие
Телефон, имя, комментарий и согласие на обработку персональных данных
Уведомление в Telegram
Заявка уходит в Telegram; пользовательский ввод экранируется
Админ-панель
Заявка остаётся в базе — её видно в модерации
Стек
8 в базеNext.js 16
App Router, Turbopack, Route Handlers
React 19 · TypeScript strictPrisma 7
ORM
16 миграцийPostgreSQL 16
Своя база
хостинг в БеларусиTailwind CSS 4
Стили
~30 React-компонентовLeaflet + MapLibre GL
Карта Минска
пины школ, метроJWT (jose) + bcryptjs
Аутентификация
HttpOnly-cookiesTelegram Bot API
Интеграция
заявки на записьDocker Compose + nginx
Инфраструктура
Let's Encrypt, Cloudflare DNSКаталог, в котором всё своё
Платформа работает на avtoschool.by: каталог с фильтрами, отзывы с модерацией и внешними рейтингами, карта Минска с метро, личные кабинеты, админ-панель и заявки в Telegram. Всё написано с нуля, типизировано в TypeScript strict и разворачивается одной командой из standalone Docker-сборки. По дороге сайт переехал на тематический домен с историей — с 301-редиректами и без даунтайма.
Хотите такой же результат?
Обсудим задачу, рассчитаем стоимость и сроки. Первый разбор — бесплатно.
Обсудить проект →