Тестовое задание 10 Mar 2023
alnair - лендинг CRM-интегратора, рефакторинг и доращивание до полноценного сайта
- React 18
- React Router
- CRA
- SCSS
- Responsive
- Accessible
Одноэкранный тёмный лендинг CRM-интегратора (шапка, герой, сетка из четырёх офферов и футер) на Create React App: со ссылками-заглушками и битыми ссылками, кнопкой, которая никуда не вела, пунктами меню на один несуществующий маршрут, дефолтными иконками фреймворка и без реальных страниц. Пересобран в рабочий сайт без смены стека и визуального стиля. Сначала правки: соц-кнопки, ведшие на пустые SPA-маршруты, теперь открывают реальные WhatsApp, Viber и Telegram, мёртвая навигация стала настоящими маршрутами с catch-all 404, фейковая ссылка на политику стала обычным текстом, статичные массивы в useState - модульными константами со стабильными ключами, добавлены lang=ru, нормальный manifest и кастомный градиентный фавикон-W (SVG, PNG-размеры, apple-touch). Сверху - модальная форма заявки по каждой кнопке: клиентская валидация, проверки телефона и email, состояния отправки и успеха, анимации появления и скрытия, focus trap, Escape и блокировка скролла, плюс двенадцать внутренних страниц (услуги, виджеты, интеграции, кейсы, сертификаты, партнёрка, вакансии, расчёт стоимости, клиенты, отзывы, YouTube-блог и FAQ), каждая со своей вёрсткой: редакционный нумерованный список, сетка карточек-чипов, двухколоночный список с маркерами, карточки-кейсы, сетка бейджей, вертикальный степпер, строки вакансий, блоки форматов, плитки-сегменты, карточки-отзывы, видео-карточки и аккордеон, с правдоподобным русским текстом. Активные состояния подсвечивают текущую страницу в шапке и футере, год в копирайте динамический, анимации сведены к быстрому fade с учётом reduced-motion. Доступность - реальный базовый уровень: skip-link, лендмарки, доступные имена, focus-visible, учёт reduced-motion, aria-hidden на декоре, и честный адаптив от 390 до 1440. React 18 + React Router 6 + Create React App + SCSS, self-hosted на боксе Hetzner за Caddy.