Сайтостроение Продвинутая вёрстка - smartgrid v2.05 (курс от 01-04-2019)

[Главбух]

Трёхнедельный онлайн курс
от Дмитрия Лаврика.

Это мероприятие для тех, кто:

1. Владеет основами вёрстки, в том числе, адаптивной
2. Периодически бесится при создании адаптивной вёрстки
3. Хочет освоить крутейший инструмент и стать мастером

О преподавателе

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

С 2011 года, под его руководством тысячи учеников прошли путь от новичков до успешных веб-программистов.

"Если уж вы дочитали досюда, значит, вас хотя бы раз в жизни бесили либо адаптивная вёрстка, либо дизайнеры, требующие соблюдения сетки, либо bootstrap, когда из-за его классов становился не виден остальной HTML-код

Новый способ, которому я хочу вас научить, использует в себе всю мощь современных технологий: flexbox и функция calc из CSS3, один из препроцессоров на выбор (LESS, SCSS, SASS, Stylus), сборщик проектов gulp и пара его чудесных плагинов.

Всё это даёт невероятный прирост в скорости и качестве вёрстки!"


Программа мероприятия:

1. • Основы Flexbox
   • Основная и вспомогательная оси
   • Лёгкие вертикальные выравнивания
   • Адаптивка без media-запросов
   • Определение размера элементов
2. • Разбор домашних работ
   • Прокачивание мастерства Flexbox
   • Тонкости адаптивных реализаций
   • Всевозможные выравнивания
   • Слабости flexbox без media
   • Node.js и NPM - основы магии
   • Gulp - сборка прое
   • LESS - генератор CSS
   • Group CSS Media Queries
   • Autoprefixer - кроссбраузерность
3. 1. Основы CSS-препроцессоров
   2. Иерархическое написание
   3. Переменные и примеси
   4. Написание кода на LESS
   5. Написание кода на SASS (SCSS)
4. 1. Основы создания сетки
   2. Отступы в px или в %
   3. Margin и padding варианты
   4. npm i smartgrid - поехали!
   5. Настройка свойств сетки
5. 
   
6. • Вёрстка макета
   • Оптимизация кода
   • Иерархия селекторов vs BEM
   • Дополнительные приёмы вёрстки
   • Наслаждение результатом

[SHOWTOGROUPS=3,4,5]

Для просмотра ссылок пройдите регистрацию

[/HIDESHOWTOGROUPS]