Проектная работа: "How to learn". Создана в рамках учебы в Яндекс.Практикум на факультете "Веб-разработчик"

Read this in other languages: EN

Описание:

"How to learn" - это типовой одностраничный сайт про методики обучения. Сайт создан по методологии BEM с файловой структурой Nested BEM.

GithHub Pages	Проектная работа на GitHub Pages

Функционал:

• Базовая верстка в HTML:
  • flex-контейнеры, бокс-модель и позиционирования
  • бокс-модель элементов
  • позиционирование
• Методология БЭМ:
  • наименование стилей
  • файловая структура стилей
  • переиспользование блоков
  • использование модификаторов и миксов
• Вставка видео через iframe
• Анимация элементов через keyframes и transition
• Базовая работа с репозиториями GIT

При наведении на ссылки меняется вид курсора и уменьшается прозрачность объектов.

Макет проекта

Ссылка на макет в Figma

Технологии:

• Flexbox
• Positioning Elements
• Animation and Transform using CSS
• Iframe
• BEM Methodology
• File Structure and File Paths (Nested BEM)
• Git

Инструкция по установке:

git clone https://github.com/goldlexx/how-to-learn.git

Запустите локальный сервер разработки с функцией перезагрузки в реальном времени для статических и динамических страниц - How do you set up a local testing server? (MDN web docs)

Будущая доработка проекта будет включать в себя:

• Адаптивная верстка сайта
• Создание формы обратной связи

Брифы:

• Бриф No1 (Flexbox, Positioning Elements, advanced HTML and CSS)
• Бриф No2 (Animation and Transform using CSS, Nested БЭМ, iframe)

Чеклисты:

• Чеклист No1
• Чеклист No2