[Udemy] Верстка сайта c использованием Gulp в модульном «Bento» стиле (Вадим Прокопчук)
В даному курсі, я повністю верстаю та коментую верстку сайту в модульному стилі, все робимо на збиранні Gulp.
Кожен верстальник багато разів зіткнеться з версткою в якій буде модульна секція, masonry розташування елементів, ну або як в даному проекті все буде побудовано в модульному стилі. У такій верстці часто є різні моменти, які викликають складнощі у розробників, які не стикалися з такими завданнями раніше. У даному відео курсі я повністю покажу як верстати подібні проекти, що використовувати і найголовніше, як потім їх адаптувати.
Крім цього, ми всі робитимемо на збиранні фронтенду Gulp. Я надаю готове складання та показую як з нею працювати. У процесі роботи ми будемо інклюдити файли, конвертувати шрифти, підключати сторонні файли, оптимізувати зображення, працювати з препроцесором SCSS та багато іншого.
Дизайн зроблений у Figma, ми використовуємо стандартні інструменти цієї програми, я показую, як можна працювати з дизайн макетом без devmode режиму.
Короткий план курсу:
Встановлення nodejs (якщо ви працюєте з gulp вперше)
Початкове налаштування проекту, підключення шрифтів + верстка header та адаптив
Верстка footer із адаптацією під мобільні пристрої
Верстка головного екрана + адаптив
Верстка блоку статистики + адаптив
Верстка блоку About
Верстка блоку Projects (слайдер)
Верстка блоку із тарифними планами
Адаптив для блоків: about, projects, tariff
Верстаємо та адаптуємо галерею
Чого ви навчитеся:
Верстка сайту HTML/CSS/JS використовуємо сучасні підходи
Навичка верстки модульного дизайну (бенто стиль)
Навичка роботи зі збирачем фронтенду gulp
Адаптивна верстка
Матеріали курсу:
2 розділу
12 лекцій
Загальна тривалість 7 год 24 хв
В даному курсі, я повністю верстаю та коментую верстку сайту в модульному стилі, все робимо на збиранні Gulp.
Кожен верстальник багато разів зіткнеться з версткою в якій буде модульна секція, masonry розташування елементів, ну або як в даному проекті все буде побудовано в модульному стилі. У такій верстці часто є різні моменти, які викликають складнощі у розробників, які не стикалися з такими завданнями раніше. У даному відео курсі я повністю покажу як верстати подібні проекти, що використовувати і найголовніше, як потім їх адаптувати.
Крім цього, ми всі робитимемо на збиранні фронтенду Gulp. Я надаю готове складання та показую як з нею працювати. У процесі роботи ми будемо інклюдити файли, конвертувати шрифти, підключати сторонні файли, оптимізувати зображення, працювати з препроцесором SCSS та багато іншого.
Дизайн зроблений у Figma, ми використовуємо стандартні інструменти цієї програми, я показую, як можна працювати з дизайн макетом без devmode режиму.
Короткий план курсу:
Встановлення nodejs (якщо ви працюєте з gulp вперше)
Початкове налаштування проекту, підключення шрифтів + верстка header та адаптив
Верстка footer із адаптацією під мобільні пристрої
Верстка головного екрана + адаптив
Верстка блоку статистики + адаптив
Верстка блоку About
Верстка блоку Projects (слайдер)
Верстка блоку із тарифними планами
Адаптив для блоків: about, projects, tariff
Верстаємо та адаптуємо галерею
Чого ви навчитеся:
Верстка сайту HTML/CSS/JS використовуємо сучасні підходи
Навичка верстки модульного дизайну (бенто стиль)
Навичка роботи зі збирачем фронтенду gulp
Адаптивна верстка
Матеріали курсу:
2 розділу
12 лекцій
Загальна тривалість 7 год 24 хв
Введення
Огляд проекту
Короткий огляд складання, яку ми використовуємо
Верстка проекту
Встановлення nodejs
Початкове налаштування проекту + верстка header
Верстка footer
Верстка головного екрана
Верстка блоку статистики
Верстка блоку About
Верстка блоку Projects (слайдер)
Верстка блоку із тарифними планами
Адаптив для блоків: about, projects, tariffs
Верстаєм та адаптуємо Gallery
Огляд проекту
Короткий огляд складання, яку ми використовуємо
Верстка проекту
Встановлення nodejs
Початкове налаштування проекту + верстка header
Верстка footer
Верстка головного екрана
Верстка блоку статистики
Верстка блоку About
Верстка блоку Projects (слайдер)
Верстка блоку із тарифними планами
Адаптив для блоків: about, projects, tariffs
Верстаєм та адаптуємо Gallery
https://www.udemy.com/c-gulp-bento/
Останнє редагування модератором: