---

🎓 Createx Online Courses Landing Page

Адаптивный одностраничный сайт онлайн-школы Createx, разработанный с использованием HTML, CSS и JavaScript. Проект демонстрирует современный дизайн, плавные анимации, фильтрацию курсов, слайдеры и адаптацию под разные устройства.

---

📋 Содержание

• Описание
• Функционал
• Используемые технологии
• Структура проекта
• Установка и запуск
• Подключаемые библиотеки
• Автор
• Лицензия

---

🧩 Описание

Createx — это промо-лендинг для онлайн-школы, предлагающей курсы по маркетингу, дизайну, HR, менеджменту и разработке. Сайт выполнен в современном стиле и включает интерактивные элементы: фильтрацию направлений, слайдер преподавателей, плавную прокрутку и адаптивное меню.

---

⚙️ Функционал

• 🌐 Адаптивная верстка под все устройства
• 📂 Фильтрация курсов с помощью MixItUp
• 🧭 Плавная навигация по якорям
• 🧍‍♂️ Слайдер преподавателей на Slick Slider
• 💬 Слайдер отзывов
• 📁 Аккордеон в разделе программы
• 🍔 Бургер-меню и затемнение фона
• 🖼 Fancybox — для открытия видео-превью
• 🗺 Поддержка подключения Google Maps (в коде закомментировано)

---

🧱 Используемые технологии

• HTML5 — семантическая разметка
• CSS3 / Flex / Grid — стилизация и адаптивность
• JavaScript (ES6) — интерактивность
• jQuery — обработка событий и анимации
• Slick Slider — реализация слайдеров
• MixItUp — фильтрация направлений
• Fancybox — модальные окна для видео

---

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

project/
│
├── index.html          # Основной HTML-файл
├── style.css           # Главные стили проекта
├── js.js               # Скрипты взаимодействия
│
├── fonts.css           # Подключение шрифтов
├── reset.css           # Сброс стандартных стилей браузера
│
├── /images/            # Изображения и иконки
│   ├── /1/ ...         # Элементы шапки
│   ├── /2/ ...         # Блоки контента
│   ├── /3/ ...         # Слайдер преподавателей
│
│── /fonts/             # Шрифты
│
└── README.md           # Документация проекта

---

🚀 Установка и запуск

1. Склонируй проект:

   git clone https://git.homyk.space/Alena/Figma_1.git
   

2. Перейди в папку проекта:

   cd Figma_1
   

3. Открой файл index.html в браузере:

   • двойным кликом,
   • или с помощью Live Server в VS Code.

---

🔗 Подключаемые библиотеки

Проект использует следующие внешние ресурсы:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui@6.0/dist/fancybox/fancybox.css" />
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css" />
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mixitup@3/dist/mixitup.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@fancyapps/ui@6.0/dist/fancybox/fancybox.umd.js"></script>

---

👤 Автор

Createx Landing Page разработан как учебный проект. Автор: [Алёна Трущёва / plx112] Email: [plx112@homyk.space] Git: [https://git.homyk.space/Alena]

---

📄 Лицензия

Этот проект учебный.

---