Демонстрация онлайн: https://estatex-realestate.netlify.app/

Большинство шаблонов для недвижимости выглядят как таблица с фотографиями — сетка карточек, ценник, кнопка «контактировать агента» и повторение сотни раз. ESTATEX отбивает этот формат каталога. Он построен вокруг одной идеи: дом должен ассоциироваться с местом, которое запоминаешь, а не с предметом, который ты пролистываешь. Каждый экран — от полноэкранного героического появления до галереи комнат по комнате на странице объекта — выстроен и отрендерен как редакционная разворот, чтобы объявление на 2 млн долларов (или весь бренд бутиковой агентства) читалось как продуманное и дорогое, а не как шаблонное и общее. Если вы когда-либо открывали сайт по недвижимости и не ощутили ничего — это решение.

Главная страница начинается с кинематографического героя, затем переходит в обзор выделенного объекта, категорийный подборщик по принципу «Исследовать по ощущению» с эффектами наведения в направлениях, асимметричная редакционная сетка объектов, раздел философии бренда, обзор агента и заключительный призыв к действию — полноценный нарратив, а не набор виджетов. Страница коллекции объектов поддерживает живой поиск и фильтрацию с плавной пагинацией и сохраненными избранными, поэтому просмотр чувствуется отзывчивым, несмотря на то, что всё выполняется на клиенте. Центр страницы — страница деталей объекта: декоративная галерея, управляемая прокруткой, которая перемещается между каждой комнатой по прокрутке посетителя, в паре с интерактивным планом этажа, картой района, разделом удобств, профилем агента и призывом к действию. Отдельные страницы для локаций, агентов, «о нас» и контактов дополняют сайт, все с единообразной дизайн-системой, и каждый статус обрабатывается бережно — пустые результаты поиска, без сохраненных избранных, индивидуальная страница 404 — не просто счастливый путь.

Здесь ничего не требует обращения к бэкенду. Контент — объекты, агенты, локации, категории — хранится в простых типизированных файлах данных в src/data/, поэтому добавить объявление или заменить биографию агента можно штрих-копированием, без интеграции CMS. Изображения тянутся через простой конструктор URL, который работает с Unsplash из коробки или с вашими фото на хостинге. Цвета, шрифты и время анимаций вынесены в централизованные токены дизайна, поэтому переформатировать весь сайт — акцентный цвет, типографика, ощущение движений — можно в нескольких файлах, а не в охоте по сотням компонентов. Полное руководство пользователя пошагово объясняет редактирование текста, изображений, навигации, цветов, шрифтов, анимаций, форм и брендинга.

Создан на Next.js 16 (App Router), React 19, TypeScript, Tailwind CSS 4, Framer Motion, GSAP с ScrollTrigger, Lenis для плавной прокрутки, Leaflet с бесплатными тайлами OpenStreetMap и React Hook Form с валидацией Zod. Контактная форма полностью валидируется с состояниями загрузки и успеха, готова подключиться к любому бэкенду форм по выбору. Полноценно адаптивен от больших десктопов до мобильных устройств.