Программирование [Дмитрий Лаврик] [SmartGrid] Продвинутая вёрстка

  • Автор темы Anonymous (9af646)
  • Дата начала
A

Anonymous (9af646)

Гость
745fa27de4.jpg

Программа курса:

Вводный вебинар:

  • Техническая информация
  • Доступы в группы и к тренажёрам
  • Обзор программы курса
  • Обзор вспомогательных инструментов
1 Занятие:
  • Основы Flexbox
  • Основная и вспомогательная оси
  • Тонкости выравнивания элементов
  • Адаптивка без media-запросов
  • Расчёт размеров элемента
  • Разбор домашних работ
  • Фокусы flex-grow
  • Нюансы в IE 11
  • Погрешность расчёта размеров
  • Код без media-запросов: за и против
2 Занятие:
  • Flex-direction: column
  • Нюансы переноса элементов
  • Вертикальные и горизонтальные отступы
  • Смена порядка следования элементов
  • Задачи, для которых flex неудобен
  • Разбор домашних работ
  • Общие выводы по технологиям
  • Необходимость автоматизации мелочей
  • Моральная подготовка к node.js
3 Занятие:
  • Node.js и NPM - основы магии
  • Gulp - сборка проекта
  • Autoprefixer - кроссбраузерность
  • Concat - соединение файлов
  • Sourcemaps - удобная отладка
  • Разбор домашних работ
  • Плагин Clean CSS
  • Group CSS Media Queries
  • Неудобства плагина concat
  • Чего не хватает в чистом CSS
4 Занятие:
  • Основы CSS-препроцессоров
  • Иерархическое написание
  • Переменные и примеси
  • Написание кода на LESS
  • Написание кода на SASS (SCSS)
  • Разбор домашних работ
  • Синтаксисы разных препроцессоров
  • LESS vs SCSS
  • Препроцессоры vs постпроцессоры
5 Занятие:
  • npm i smart-grid - поехали!
  • Основы создания сетки
  • Отступы в px или в %
  • Margin и padding варианты
  • Настройка свойств сетки
  • Разбор домашних работ
  • Нюансы fields и offset
  • Резиновые и обычные элементы
  • Row и col без size
6 Занятие:
  • Вёрстка макета
  • Оптимизация кода
  • Иерархия селекторов vs BEM
  • Дополнительные приёмы вёрстки
  • Кроссбраузерность
  • Разбор домашних работ
  • Подведение итогов курса
  • Ответы на финальные вопросы
  • Направление дальнейшего развития
СКАЧАТЬ КУРС:
 

Обратите внимание

Назад
Сверху