Cresta

Cresta — портфолио-проект в формате многостраничного сайта для вымышленной IT-компании, специализирующейся на кибербезопасности, IT-инфраструктуре, облачных решениях и консалтинге.

Проект сделан как витринная работа: он показывает компонентную архитектуру, дизайн-токены, адаптивную вёрстку, оптимизированные изображения, статическую генерацию страниц, базовую доступность, SEO-метаданные и production-oriented сборку для GitHub Pages.

Cresta в этом репозитории — fictional portfolio/demo project. Проект не связан с реальными компаниями, продуктами или брендами с похожим названием.

Контент, контакты, адреса, юридические страницы, статьи, кейсы и сценарии форм являются демонстрационными. Формы не отправляют и не сохраняют реальные данные: backend и сторонние form services не используются.

Live demo: https://mangust5580.github.io/Cresta/

Состав проекта

• Главная страница с hero-блоком, преимуществами, кейсами, процессом работы, партнёрами и CTA.
• Страница о компании.
• Страница услуг и 8 детальных страниц услуг.
• Страница кейсов и 6 детальных страниц проектов.
• Блог и 9 страниц статей.
• Страница контактов с формой.
• Страницы Privacy Policy и Terms of Use.
• Thank-you страница для сценариев форм.
• Кастомная страница 404.
• Адаптивная вёрстка от 320px.
• Подготовка к публикации на GitHub Pages через GitHub Actions.

Quality checks

• npm run check:icons проверяет SVG-иконки на корректную работу с цветом.
• npx tsc --noEmit проверяет TypeScript.
• npm run build создаёт production-сборку.
• npm run check запускает полный набор проверок проекта.

Сборка

Проект использует Minista для статической генерации многостраничного сайта.

Сборка обрабатывает React/TSX-страницы, SCSS, дизайн-токены, SVG-иконки, локальные шрифты, адаптивные изображения и production-артефакты для GitHub Pages.

Production output: dist/.

GitHub Actions workflow собирает проект и публикует dist/ на GitHub Pages через официальный Pages artifact deployment.

Стек

• Minista.
• React.
• TypeScript.
• SCSS.
• CSS custom properties для дизайн-токенов.
• Адаптивные изображения через Minista image pipeline.
• SVG-иконки и sprite pipeline.
• Локальные шрифты.
• GitHub Actions.
• GitHub Pages.

Структура проекта

src/
  assets/      Изображения, SVG-иконки и шрифты
  layouts/     Глобальный layout сайта
  pages/       Страницы сайта
  shared/      Компоненты, секции, data-layer и layout-блоки
  styles/      Core styles, tokens, helpers и глобальные стили

scripts/       Проверки проекта
dist/          Production-сборка