Мы в сети

VK
FB

Оформите подписку!

 Введите Ваш E-m@il и
получайте свежие новости

Видеокурс
Видеокурс "Препроцессоры SASS и LESS. Автоматизация Front-end разработки". (Владилен Минин - Webformyself)
Видео урок

Рейтинг:

Издательство WebForMySelf Издательство: WebForMySelf

Страница автора - Владилен Минин - Webformyself Автор курса: Владилен Минин

Видеокурс Тематика: HTML и CSS | Веб – разработка | Создание сайтов и блогов

Автор(ы): Владилен Минин

Это уникальный видеокурс на рынке Рунета, который во всех подробностях дает теоретическое и практическое освещение всех возможностей двух наиболее популярных и востребованных на рынке CSS-препроцессоров SASS и LESS в рамках единого курса. Помимо ПОЛНОГО ОСВЕЩЕНИЯ теоретических основ и практики работы непосредственно с самими препроцессорами SASS и LESS, а также изучения методологии CSS, в курсе в мельчайших подробностях разобрана практика работы с такими прогрессивными популярными технологиями как NODE.JS, NPM и GULP.

Смотреть видео:

Препроцессоры Sass и Less. Автоматизация и упрощение Front-end разработки. (Владилен Минин - Webformyself)

  • БЛОК 1. Теория. Препроцессор LESS

В данном блоке будет подробным образом разобрана теоретическая часть препроцессора Less. Начнем с самых основ: разберем, что такое Less, и где он используется. У препроцессора Less есть множество возможностей применения и компиляции, каждая из которых будет рассмотрена в рамках данного курса. Мы разберемся в самой простой из них: компиляции без написания единой строчки кода, создадим свой собственный компилятор с помощью платформы NodeJS и рассмотрим возможности компиляции с помощью таск-раннера Gulp с использованием возможностей PostCSS. Мы с вами будем знакомиться со всеми возможностями данного языка. Помимо синтаксиса, будут разобраны самые важные конструкции, такие как: переменные, вложенные стили, наследование, создание функций, циклы и многое другое.

  • Урок 1. Что такое Less.

Вы узнаете, что такое препроцессоры, и зачем они нужны. Далее, с помощью тестового онлайн-компилятора, мы увидим пример и базовую возможность Less для создания CSS стилей, и вы поймете, каким образом оно работает"

  • Урок 2. Компиляция на клиенте.

Рассмотрим первый способ, который позволит нам скомпилировать данный язык программирования. Это самый простой способ, который не требует от нас ничего в плане написания кода, и будет делать все средствами, которые заложены в библиотеке Less. Вся компиляция будет происходить в файле index.html" class="col_3 col_3_medium"

  • Урок 3. Компиляция на NodeJS.

Рассмотрим следующий способ компиляции языка Less — с помощью платформы NodeJS. В ходе урока мы напишем свой собственный компилятор, который будет считывать Less файлы и генерировать на их основе .css файлы"

  • Урок 4. Компиляция с помощью Gulp.

В ходе урока вы узнаете, как подключить Gulp к проекту, какие шаги нужно учесть для написания задач компиляции препроцессора. Также нами будет организован сервер автоматической перезагрузки окна браузера для моментального применения скомпилированных стилей"

  • Урок 5. Переменные.

В этом уроке вы узнаете все про переменные в языке Less. Начнем мы с синтаксиса и узнаем, какие значения можно задавать переменным. Также мы поговорим про область видимости переменных, которая присутствует и в данном языке, про ссылки на другие переменные и многое другое" class="col_3 col_3_medium"

  • Урок 6. Миксины. Часть 1.

Вы узнаете, каким образом создавать миксины в языке Less, как сделать компилируемые миксины и некомпилируемые, которые будут использоваться только в рамках разработки и выполнять действие функций. А также вы узнаете, как работает флаг !important для миксинов, и в чем его особенность"

  • Урок 7. Миксины. Часть 2.

Узнаете, как создавать миксины-функции, которые работают с входными параметрами. Поймете, как можно перегружать функции, подобно другим языкам программирования, в зависимости от разного количества параметров. Узнаете, как передавать параметры по умолчанию, и что такое ключевое слово Arguments, по аналогии с JavaScript"

  • Урок 8. Миксины.  Часть 3.

Вы узнаете, как создавать миксины, которые генерируют параметры или другие миксины. Поговорим про их область видимости и способы применения" class="col_3 col_3_medium"

  • Урок 9. Вложенность.

В этом уроке Вы увидите, как просто можно записывать различные сложные структуры CSS стилей без дублирования кода, создавать названия классов, основываясь на других классах, и просто задавать псевдоселекторы"

  • Урок 10. Операторы.

В данном уроке вы узнаете, как с помощью введения операторов в язык стилей препроцессор Less упростил жизнь для разработки дизайнов"

  • Урок 11. Наследование.

Из этого видео вы поймете, что такое функция Extend, как ее использовать, ее синтаксис, и увидите, как с помощью различных параметров — селекторов и флагов, можно управлять наследованием " class="col_3 col_3_medium"

  • Урок 12. Некомпилируемые  строки.

В языке CSS порой появляются новые возможности, которые иногда конфликтуют с синтаксисом препроцессоров. Для того чтобы результат был ожидаемым, вне зависимости от нововведений, в препроцессоре Less есть важная функция, которая позволяет не обрабатывать определенные строки, с ней вы и познакомитесь в данном уроке"

  • Урок 13. Циклы.

Из этого урока, вы узнаете, с помощью каких конструкций можно создать цикл в языке стилей, зачем они нужны, и как их применить на практике — например, для генерации большого количества классов для сетки вашего сайта с помощью пары строк кода"

  • Урок 14. Импорты.

Рассмотрим, как препроцессор Less расширяет возможность стандартных импортов CSS, и как с ними работать. Вы поймете, как Less может взаимодействовать с CSS, какие флаги, и зачем используются при импортировании стилей в файлах языка Less" class="col_3 col_3_medium"

  • Урок 15. Встроенные функции.

Познакомитесь с некоторыми встроенными функциями в язык Less, которые расширяют стандартные возможности CSS. Например, вы узнаете, как можно сделать цвет темнее или светлее, не меняя его, а используя лишь встроенные функции"

► В итоге, вы научитесь нескольким способам компиляции языка Less, а также освоите все его функции, которые сможете применить на реальных проектах. Вы поймете, почему препроцессоры целесообразно использовать на любом из проектов, и как сильно Less упрощает жизнь в плане написания стилей

  • БЛОК 2. Теория.  Препроцессор SASS

В данном блоке будет подробнейшим образом рассмотрена теоретическая составляющая препроцессора SASS и SCSS. Вы узнаете, как и где его использовать, а также, как настроить рабочее окружение, чтобы с ним работать. В первую очередь, мы разберем два основных понятия данного препроцессора — SASS и SCSS. Вы узнаете, что это такое, почему эти две аббревиатуры часто идут вместе, и в чем их отличие. Далее мы рассмотрим, как можно настроить максимально эффективное рабочее окружение для компиляции данного препроцессора — с помощью таск раннера Gulp. В него будут входить разные возможности PostCSS для обработки стилей после компиляции, сервер автоматического применения стилей без перезагрузки окна браузера, минификация, исходные карты и т. д. После прохождения данного блока вы смело сможете использовать SASS и SCSS при разработке ваших проектов, используя максимально возможный функционал данного языка. Мы детально разберем каждую из возможностей языка, начиная с синтаксиса. Аналогично будут разобраны следующие возможности: переменные и их область видимости, функции, миксины, медиа запросы, генерация классов через 3 вида циклов и многое другое.

  • Урок 1. Что такое SASS и SCSS.

В данном уроке вы узнаете, что такое препроцессор SASS. Вы узнаете, где он используется, зачем он нужен. Также вы увидите, в чем отличие SASS от SCSS, и какой синтаксис лучше использовать"

  • Урок 2. Настройка окружения для компиляции.

В этом уроке вы увидите, как с помощью такого инструмента как Gulp, настроить рабочее окружение для компиляции препроцессора SASS. Вы узнаете, какие шаги стоит реализовать при настройке рабочего окружения. Поймете, какие плагины от PostCSS можно использовать для более эффективного написания кода " class="col_3 col_3_medium"

  • Урок 3. Переменные.

В этом уроке вы познакомитесь с синтаксисом SCSS и конкретно узнаете, как создавать переменные в рамках данного языка. Также вы узнаете, какие значения могут принимать переменные в SASS. И еще мы поговорим про область видимости переменных, и какие проблемы могут возникнуть с ней"

  • Урок 4. Некомпилируемые файлы настройки.

В данном уроке вы узнаете, что такое файлы настроек в препроцессорах, в чем их особенность, и зачем они нужны. Вы увидите на реальном примере создание такого файла-конфига, и по каким правилам их нужно создавать"

  • Урок 5. Некомпилируемые файлы настройки.

В данном уроке мы начнем знакомство с одной из самых главных функций языка SASS — миксинами. Вы узнаете, с помощью каких конструкций можно создавать миксины, что это такое, и зачем они нужны" class="col_3 col_3_medium"

  • Урок 6. Миксины. Часть 2.

В данном уроке мы продолжим изучение миксинов, и на этот раз поговорим про то, как можно передавать параметры в них. Вы узнаете все особенности передачи параметров, начиная от задания параметров по умолчанию до задания именованных параметров и конкатенации входящих данных"

  • Урок 7. Миксины. Часть 3.

В этом уроке мы закончим изучение миксинов в языке SASS. Из этого урока вы узнаете, что такое ключевое слово Content, и как удобно можно с ним работать совместно с миксинами"

  • Урок 8. Импорты.

В результате данного урока мы напишем специальный миксин, который будет загружать нужные шрифты с удаленного сервера, основываясь только на входящем имена шрифта. Также вы увидите, как правильно использовать шаблонизацию в рамках данного препроцессора" class="col_3 col_3_medium"

  • Урок 9. Медиа запросы.

В данном уроке вы увидите, как препроцессор SASS облегчает работу с медиа запросами в CSS. Вы узнаете, как вместе с миксинами можно удобно использовать данную возможность для адаптации некоторых стилей под различную ширину экрана"

  • Урок 10. Операторы.

В этом уроке вы познакомитесь с такой темой в языке SASS, как операторы. Вы увидите, какие из них можно применять в рамках данного языка, как их использовать, как быть с конвертацией различных единиц измерения и увидите, как операторы можно применять для удобной работы с цветами"

  • Урок 11. Встроенные функции.

Из данного урока вы узнаете какими удобными функциями язык SASS расширяет стандартные возможности CSS. Мы разберем несколько из них, например, для удобной работы с цветами или задания прозрачности элементам" class="col_3 col_3_medium"

  • Урок 12. Создание своих функций.

Из данного урока вы узнаете, как можно создавать свои собственные функции в SASS, и чем они отличаются от миксинов. Вы увидите, где и как их можно использовать, а также узнаете еще несколько ключевых слов, которые нужны для работы с данным функционалом в языке SASS"

  • Урок 13. Наследование стилей.

Из данного урока вы узнаете про еще одно ключевое слово в препроцессоре SASS —Extend. Вы поймете, зачем данная директива нужна, как она может пригодиться в реальном приложении. Также вы увидите особенности синтаксиса данной конструкции, и с помощью каких параметров можно регулировать наследование"

  • Урок 14. Условные директивы If Else.

В данном уроке мы познакомимся еще с одним интересным и очень важным функционалом языка SASS — условными директивами If и Else. Вы увидите, как их использовать в коде, зачем они нужны, за что они отвечают, и как их можно применить в реальном проекте" class="col_3 col_3_medium"

  • Урок 15. Циклы.

В данном уроке вы познакомитесь еще с одним важным функционалом препроцессора SASS — циклами. Вы узнаете, как их можно применить в рамках языка стилей, увидите генерацию грид-сетки, а также генерацию специальных классов со специальными идентификаторами"

► После прохождения данного блока вы смело сможете использовать SASS и SCSS при разработке ваших проектов, используя максимально возможный функционал данного языка. Мы детально разберем каждую из возможностей языка, начиная с синтаксиса. Аналогично будут разобраны следующие возможности: переменные и их область видимости, функции, миксины, медиа запросы, генерация классов через 3 вида циклов и многое другое.

  • БЛОК 3. Теория. CSS методологии

Будут рассмотрены 2 основных способа организации CSS кода: БЭМ и наследование. Вы увидите на простых идентичных примерах, как применять ту или иную инструкцию, и в чем их отличие.

  • Урок 1. Что такое CSS методологии.

В данном уроке вы узнаете, зачем были созданы такие понятия, как CSS методологии. Вы узнаете, какие проблемы стандартного CSS они решают, почему нужно придерживаться данных инструкций"

  • Урок 2. БЭМ.

В этом уроке вы узнаете, что такое CSS методология БЭМ. Вы познакомитесь с основными ее принципами, и на простом, но наглядном примере, поймете, каким образом ее применять на практике"

  • Урок 3. Наследование.

В этом уроке вы узнаете, что такое CSS методология наследование. Вы познакомитесь с основными ее принципами, и на простом, но наглядном примере поймете, каким образом ее применять на практике"

► В рамках данного блока вы познакомитесь с таким понятием, как CSS методологии, и узнаете, что из себя представляют данные инструкции, и зачем они нужны.

  • БЛОК 4. Практика. Препроцессор SASS

Вы узнаете, какие первые шаги нужно будет сделать для более быстрой верстки — задание основных параметров проекта и создание глобальных некомпилируемых миксинов. После задания общей структуры проекта мы начнем непосредственно саму верстку проекта по отдельным блокам. Верстать будем по CSS методологии БЭМ: вы увидите, как ее применить на практике, включая сложные блоки со множественной вложенностью. После завершения верстки вы увидите, как за несколько секунд сделать финальную сборку одного CSS файла, который будет включать в себя все стили проекта, сделать его минификацию и удалить исходные карты.

  • Урок 1. Вводный.

В данном обзорном уроке вы узнаете план на данный блок, с помощью чего мы будем верстать макет, увидите сам макет, с помощью какой методологии будет проходить практика и узнаете одну особенность данного блока"

  • Урок 2. Настройка рабочего окружения.

В данном уроке вы увидите, как профессионально настроить Gulp для осуществления максимально эффективной работы над версткой макета на препроцессоре"

  • Урок 3. Создание миксинов и параметров проекта.

В данном уроке вы увидите первые шаги, которые необходимо предпринять для начала работы над макетом уже непосредственно в SCSS коде"

  • Урок 4. Блок навигации.

В этом уроке нами будет сверстан блок навигации, с использованием методологии БЭМ и такого CSS инструмента, как Flexbox. Также вы узнаете, что такое vh, и как с помощью данной величины сделать блок на всю высоту экрана без JavaScript"

  • Урок 5. Блок хедера.

В данном уроке вы увидите, как можно сверстать блок хедера, и как всего лишь двумя свойствами выровнять элементы по центру блока: по горизонтали и по вертикали с использованием флекс бокс"

  • Урок 6. Блок авторизации.

В этом уроке мы сверстаем маленький блок для авторизации пользователей"

  • Урок 7. Блок покупки. Часть 1.

В данном уроке мы начнем верстать самый объемный блок макета — блок покупок, или блок выбора домена. В первой части нам предстоит задать общую структуру и сделать первую часть блока — инпут"

  • Урок 8. Блок покупки. Часть 2.

В этом уроке мы продолжим верстку блока покупок — сделаем верстку таблицы, с довольно необычными прерывающимися границами. Вы увидите один из самых простых подходов, который позволит это реализовать"

  • Урок 9. Блок покупки. Часть 3.

В этом заключительном уроке по блоку покупок мы с вами сверстаем выпадающий список, который будет появляться только при наведении мыши без использования JavaScript. Также мы установим библиотеку для шрифтов — Font Awesome"

  • Урок 10. Блок пакетов.

В этом уроке вы увидите, как можно сверстать блок пакетов или тарифов. В данном уроке мы создадим новый миксин, который позволит очень сильно сократить код в зависимости от модификатора на элементе"

  • Урок 11. Блок о нас.

В данном уроке будет сверстан блок макета «О нас»

  • Урок 12. Блок слайдера.

В данном уроке мы сверстаем слайдер и добавим 3 слайда, но пока без функционала"

  • Урок 13. Блок преимущества.

В данном уроке мы сверстаем довольно простой блок преимуществ, в котором снова будем использовать иконки Font Awesome"

  • Урок 14. Блок подвала.

Данный урок посвящен блоку подвала или футера, который будет являться заключительным для макета"

  • Урок 15. Функционал слайдера и продакшн сборка.

В этом уроке мы с вами сделаем продакшн сборку, то есть удалим всю ненужную информацию из CSS файла и сократим его размер в 4 раза! А еще мы напишем на чистом JavaScript функционал для слайдера"

► Вы с нуля увидите, как создать максимально эффективное рабочее окружение для верстки. Синтаксис используемый в блоке — SCSS, который является более строгой версией языка SASS.

  • БЛОК 5. Практика. Препроцессор LESS

Методология, выбранная для данного блока — наследование. Вы увидите, как просто и правильно совместно с препроцессором использовать данную методологию, и как такой подход позволяет сократить количество классов и максимально очистить html. Также вы увидите, как можно подключить специальную библиотеку шрифтов-картинок и тем самым оптимизировать размер таблицы стилей. После задания всех стилей мы буквально за пару секунд с помощью сборщика сделаем финальную сборку в один файл, и вы увидите, как это важно, потому что результат шаблона не изменится, а размер файла сократится почти в 4 раза.

  • Урок 1. Вводный.

В данном вводном уроке вы увидите шаблон, который нам предстоит сверстать. Вы узнаете, с помощью какой методологии будет сверстан данный макет, и каким изменениям он будет подвержен"

  • Урок 2. Настройка рабочего окружения.

В этом уроке вы увидите профессиональную настройку сборщика Gulp для автоматизации процессов при верстке на CSS препроцессоре"

  • Урок 3. Создание миксинов и параметров проекта.

В данном уроке вы узнаете, какой первый шаг стоит сделать перед началом процесса верстки. В процессе урока мы зададим общие стили для проекта, создадим файл параметров и сделаем пару необходимых базовых миксинов"

  • Урок 4. Блок навигации.

В данном уроке нами будет сверстан блок навигации. Также мы рассмотрим способ добавление иконок из шрифта Font Awesome"

  • Урок 5. Блок хедера.

В этом уроке мы сверстаем блок хедера. Также мы добавим общий класс для кнопок на весь проект"

  • Урок 6. Блок функций.

В данном уроке вы увидите, как сверстать блок функций, и как совместить картинку и текст"

  • Урок 7. Блок преимуществ.

В данном уроке мы продолжим верстку макета с блоком преимуществ"

  • Урок 8. Блок решений.

В данном уроке мы сверстаем довольно интересный блок с тремя элементами. В рамках урока будет затронута тема: как создать трапецию на чистом CSS"

  • Урок 9. Блок автора.

Данный урок посвящен блоку с текстом и описанием автора"

  • Урок 10. Блок шагов.

В этом уроке мы сверстаем блок с тремя элементами с разным наполнением, но одинаковым каркасом"

  • Урок 11. Блок подвала.

Этот урок, финальный в плане верстки, будет посвящен подвалу или футеру макета. Также мы создадим еще один миксин"

  • Урок 12. Финальная сборка.

В этом уроке мы сделаем продакшн сборку — сделаем минификацию файла CSS и уберем исходные карты, написав всего одну строчку кода. Вы увидите, как данная оптимизация применима на практике, и насколько она важна"

► Вы с нуля увидите, как организовать максимально эффективное и быстрое рабочее окружение для верстки с использованием препроцессора и сервера быстрой автоматической перезагрузки страницы. Также мы заложим функционал для создания финальной версии сборки стилей в один файл.

Содержание:
  • БЛОК 1. Теория. Препроцессор LESS

В данном блоке будет подробным образом разобрана теоретическая часть препроцессора Less. Начнем с самых основ: разберем, что такое Less, и где он используется. У препроцессора Less есть множество возможностей применения и компиляции, каждая из которых будет рассмотрена в рамках данного курса. Мы разберемся в самой простой из них: компиляции без написания единой строчки кода, создадим свой собственный компилятор с помощью платформы NodeJS и рассмотрим возможности компиляции с помощью таск-раннера Gulp с использованием возможностей PostCSS. Мы с вами будем знакомиться со всеми возможностями данного языка. Помимо синтаксиса, будут разобраны самые важные конструкции, такие как: переменные, вложенные стили, наследование, создание функций, циклы и многое другое.

  • Урок 1. Что такое Less.

Вы узнаете, что такое препроцессоры, и зачем они нужны. Далее, с помощью тестового онлайн-компилятора, мы увидим пример и базовую возможность Less для создания CSS стилей, и вы поймете, каким образом оно работает"

  • Урок 2. Компиляция на клиенте.

Рассмотрим первый способ, который позволит нам скомпилировать данный язык программирования. Это самый простой способ, который не требует от нас ничего в плане написания кода, и будет делать все средствами, которые заложены в библиотеке Less. Вся компиляция будет происходить в файле index.html" class="col_3 col_3_medium"

  • Урок 3. Компиляция на NodeJS.

Рассмотрим следующий способ компиляции языка Less — с помощью платформы NodeJS. В ходе урока мы напишем свой собственный компилятор, который будет считывать Less файлы и генерировать на их основе .css файлы"

  • Урок 4. Компиляция с помощью Gulp.

В ходе урока вы узнаете, как подключить Gulp к проекту, какие шаги нужно учесть для написания задач компиляции препроцессора. Также нами будет организован сервер автоматической перезагрузки окна браузера для моментального применения скомпилированных стилей"

  • Урок 5. Переменные.

В этом уроке вы узнаете все про переменные в языке Less. Начнем мы с синтаксиса и узнаем, какие значения можно задавать переменным. Также мы поговорим про область видимости переменных, которая присутствует и в данном языке, про ссылки на другие переменные и многое другое" class="col_3 col_3_medium"

  • Урок 6. Миксины. Часть 1.

Вы узнаете, каким образом создавать миксины в языке Less, как сделать компилируемые миксины и некомпилируемые, которые будут использоваться только в рамках разработки и выполнять действие функций. А также вы узнаете, как работает флаг !important для миксинов, и в чем его особенность"

  • Урок 7. Миксины. Часть 2.

Узнаете, как создавать миксины-функции, которые работают с входными параметрами. Поймете, как можно перегружать функции, подобно другим языкам программирования, в зависимости от разного количества параметров. Узнаете, как передавать параметры по умолчанию, и что такое ключевое слово Arguments, по аналогии с JavaScript"

  • Урок 8. Миксины.  Часть 3.

Вы узнаете, как создавать миксины, которые генерируют параметры или другие миксины. Поговорим про их область видимости и способы применения" class="col_3 col_3_medium"

  • Урок 9. Вложенность.

В этом уроке Вы увидите, как просто можно записывать различные сложные структуры CSS стилей без дублирования кода, создавать названия классов, основываясь на других классах, и просто задавать псевдоселекторы"

  • Урок 10. Операторы.

В данном уроке вы узнаете, как с помощью введения операторов в язык стилей препроцессор Less упростил жизнь для разработки дизайнов"

  • Урок 11. Наследование.

Из этого видео вы поймете, что такое функция Extend, как ее использовать, ее синтаксис, и увидите, как с помощью различных параметров — селекторов и флагов, можно управлять наследованием " class="col_3 col_3_medium"

  • Урок 12. Некомпилируемые  строки.

В языке CSS порой появляются новые возможности, которые иногда конфликтуют с синтаксисом препроцессоров. Для того чтобы результат был ожидаемым, вне зависимости от нововведений, в препроцессоре Less есть важная функция, которая позволяет не обрабатывать определенные строки, с ней вы и познакомитесь в данном уроке"

  • Урок 13. Циклы.

Из этого урока, вы узнаете, с помощью каких конструкций можно создать цикл в языке стилей, зачем они нужны, и как их применить на практике — например, для генерации большого количества классов для сетки вашего сайта с помощью пары строк кода"

  • Урок 14. Импорты.

Рассмотрим, как препроцессор Less расширяет возможность стандартных импортов CSS, и как с ними работать. Вы поймете, как Less может взаимодействовать с CSS, какие флаги, и зачем используются при импортировании стилей в файлах языка Less" class="col_3 col_3_medium"

  • Урок 15. Встроенные функции.

Познакомитесь с некоторыми встроенными функциями в язык Less, которые расширяют стандартные возможности CSS. Например, вы узнаете, как можно сделать цвет темнее или светлее, не меняя его, а используя лишь встроенные функции"

► В итоге, вы научитесь нескольким способам компиляции языка Less, а также освоите все его функции, которые сможете применить на реальных проектах. Вы поймете, почему препроцессоры целесообразно использовать на любом из проектов, и как сильно Less упрощает жизнь в плане написания стилей

  • БЛОК 2. Теория.  Препроцессор SASS

В данном блоке будет подробнейшим образом рассмотрена теоретическая составляющая препроцессора SASS и SCSS. Вы узнаете, как и где его использовать, а также, как настроить рабочее окружение, чтобы с ним работать. В первую очередь, мы разберем два основных понятия данного препроцессора — SASS и SCSS. Вы узнаете, что это такое, почему эти две аббревиатуры часто идут вместе, и в чем их отличие. Далее мы рассмотрим, как можно настроить максимально эффективное рабочее окружение для компиляции данного препроцессора — с помощью таск раннера Gulp. В него будут входить разные возможности PostCSS для обработки стилей после компиляции, сервер автоматического применения стилей без перезагрузки окна браузера, минификация, исходные карты и т. д. После прохождения данного блока вы смело сможете использовать SASS и SCSS при разработке ваших проектов, используя максимально возможный функционал данного языка. Мы детально разберем каждую из возможностей языка, начиная с синтаксиса. Аналогично будут разобраны следующие возможности: переменные и их область видимости, функции, миксины, медиа запросы, генерация классов через 3 вида циклов и многое другое.

  • Урок 1. Что такое SASS и SCSS.

В данном уроке вы узнаете, что такое препроцессор SASS. Вы узнаете, где он используется, зачем он нужен. Также вы увидите, в чем отличие SASS от SCSS, и какой синтаксис лучше использовать"

  • Урок 2. Настройка окружения для компиляции.

В этом уроке вы увидите, как с помощью такого инструмента как Gulp, настроить рабочее окружение для компиляции препроцессора SASS. Вы узнаете, какие шаги стоит реализовать при настройке рабочего окружения. Поймете, какие плагины от PostCSS можно использовать для более эффективного написания кода " class="col_3 col_3_medium"

  • Урок 3. Переменные.

В этом уроке вы познакомитесь с синтаксисом SCSS и конкретно узнаете, как создавать переменные в рамках данного языка. Также вы узнаете, какие значения могут принимать переменные в SASS. И еще мы поговорим про область видимости переменных, и какие проблемы могут возникнуть с ней"

  • Урок 4. Некомпилируемые файлы настройки.

В данном уроке вы узнаете, что такое файлы настроек в препроцессорах, в чем их особенность, и зачем они нужны. Вы увидите на реальном примере создание такого файла-конфига, и по каким правилам их нужно создавать"

  • Урок 5. Некомпилируемые файлы настройки.

В данном уроке мы начнем знакомство с одной из самых главных функций языка SASS — миксинами. Вы узнаете, с помощью каких конструкций можно создавать миксины, что это такое, и зачем они нужны" class="col_3 col_3_medium"

  • Урок 6. Миксины. Часть 2.

В данном уроке мы продолжим изучение миксинов, и на этот раз поговорим про то, как можно передавать параметры в них. Вы узнаете все особенности передачи параметров, начиная от задания параметров по умолчанию до задания именованных параметров и конкатенации входящих данных"

  • Урок 7. Миксины. Часть 3.

В этом уроке мы закончим изучение миксинов в языке SASS. Из этого урока вы узнаете, что такое ключевое слово Content, и как удобно можно с ним работать совместно с миксинами"

  • Урок 8. Импорты.

В результате данного урока мы напишем специальный миксин, который будет загружать нужные шрифты с удаленного сервера, основываясь только на входящем имена шрифта. Также вы увидите, как правильно использовать шаблонизацию в рамках данного препроцессора" class="col_3 col_3_medium"

  • Урок 9. Медиа запросы.

В данном уроке вы увидите, как препроцессор SASS облегчает работу с медиа запросами в CSS. Вы узнаете, как вместе с миксинами можно удобно использовать данную возможность для адаптации некоторых стилей под различную ширину экрана"

  • Урок 10. Операторы.

В этом уроке вы познакомитесь с такой темой в языке SASS, как операторы. Вы увидите, какие из них можно применять в рамках данного языка, как их использовать, как быть с конвертацией различных единиц измерения и увидите, как операторы можно применять для удобной работы с цветами"

  • Урок 11. Встроенные функции.

Из данного урока вы узнаете какими удобными функциями язык SASS расширяет стандартные возможности CSS. Мы разберем несколько из них, например, для удобной работы с цветами или задания прозрачности элементам" class="col_3 col_3_medium"

  • Урок 12. Создание своих функций.

Из данного урока вы узнаете, как можно создавать свои собственные функции в SASS, и чем они отличаются от миксинов. Вы увидите, где и как их можно использовать, а также узнаете еще несколько ключевых слов, которые нужны для работы с данным функционалом в языке SASS"

  • Урок 13. Наследование стилей.

Из данного урока вы узнаете про еще одно ключевое слово в препроцессоре SASS —Extend. Вы поймете, зачем данная директива нужна, как она может пригодиться в реальном приложении. Также вы увидите особенности синтаксиса данной конструкции, и с помощью каких параметров можно регулировать наследование"

  • Урок 14. Условные директивы If Else.

В данном уроке мы познакомимся еще с одним интересным и очень важным функционалом языка SASS — условными директивами If и Else. Вы увидите, как их использовать в коде, зачем они нужны, за что они отвечают, и как их можно применить в реальном проекте" class="col_3 col_3_medium"

  • Урок 15. Циклы.

В данном уроке вы познакомитесь еще с одним важным функционалом препроцессора SASS — циклами. Вы узнаете, как их можно применить в рамках языка стилей, увидите генерацию грид-сетки, а также генерацию специальных классов со специальными идентификаторами"

► После прохождения данного блока вы смело сможете использовать SASS и SCSS при разработке ваших проектов, используя максимально возможный функционал данного языка. Мы детально разберем каждую из возможностей языка, начиная с синтаксиса. Аналогично будут разобраны следующие возможности: переменные и их область видимости, функции, миксины, медиа запросы, генерация классов через 3 вида циклов и многое другое.

  • БЛОК 3. Теория. CSS методологии

Будут рассмотрены 2 основных способа организации CSS кода: БЭМ и наследование. Вы увидите на простых идентичных примерах, как применять ту или иную инструкцию, и в чем их отличие.

  • Урок 1. Что такое CSS методологии.

В данном уроке вы узнаете, зачем были созданы такие понятия, как CSS методологии. Вы узнаете, какие проблемы стандартного CSS они решают, почему нужно придерживаться данных инструкций"

  • Урок 2. БЭМ.

В этом уроке вы узнаете, что такое CSS методология БЭМ. Вы познакомитесь с основными ее принципами, и на простом, но наглядном примере, поймете, каким образом ее применять на практике"

  • Урок 3. Наследование.

В этом уроке вы узнаете, что такое CSS методология наследование. Вы познакомитесь с основными ее принципами, и на простом, но наглядном примере поймете, каким образом ее применять на практике"

► В рамках данного блока вы познакомитесь с таким понятием, как CSS методологии, и узнаете, что из себя представляют данные инструкции, и зачем они нужны.

  • БЛОК 4. Практика. Препроцессор SASS

Вы узнаете, какие первые шаги нужно будет сделать для более быстрой верстки — задание основных параметров проекта и создание глобальных некомпилируемых миксинов. После задания общей структуры проекта мы начнем непосредственно саму верстку проекта по отдельным блокам. Верстать будем по CSS методологии БЭМ: вы увидите, как ее применить на практике, включая сложные блоки со множественной вложенностью. После завершения верстки вы увидите, как за несколько секунд сделать финальную сборку одного CSS файла, который будет включать в себя все стили проекта, сделать его минификацию и удалить исходные карты.

  • Урок 1. Вводный.

В данном обзорном уроке вы узнаете план на данный блок, с помощью чего мы будем верстать макет, увидите сам макет, с помощью какой методологии будет проходить практика и узнаете одну особенность данного блока"

  • Урок 2. Настройка рабочего окружения.

В данном уроке вы увидите, как профессионально настроить Gulp для осуществления максимально эффективной работы над версткой макета на препроцессоре"

  • Урок 3. Создание миксинов и параметров проекта.

В данном уроке вы увидите первые шаги, которые необходимо предпринять для начала работы над макетом уже непосредственно в SCSS коде"

  • Урок 4. Блок навигации.

В этом уроке нами будет сверстан блок навигации, с использованием методологии БЭМ и такого CSS инструмента, как Flexbox. Также вы узнаете, что такое vh, и как с помощью данной величины сделать блок на всю высоту экрана без JavaScript"

  • Урок 5. Блок хедера.

В данном уроке вы увидите, как можно сверстать блок хедера, и как всего лишь двумя свойствами выровнять элементы по центру блока: по горизонтали и по вертикали с использованием флекс бокс"

  • Урок 6. Блок авторизации.

В этом уроке мы сверстаем маленький блок для авторизации пользователей"

  • Урок 7. Блок покупки. Часть 1.

В данном уроке мы начнем верстать самый объемный блок макета — блок покупок, или блок выбора домена. В первой части нам предстоит задать общую структуру и сделать первую часть блока — инпут"

  • Урок 8. Блок покупки. Часть 2.

В этом уроке мы продолжим верстку блока покупок — сделаем верстку таблицы, с довольно необычными прерывающимися границами. Вы увидите один из самых простых подходов, который позволит это реализовать"

  • Урок 9. Блок покупки. Часть 3.

В этом заключительном уроке по блоку покупок мы с вами сверстаем выпадающий список, который будет появляться только при наведении мыши без использования JavaScript. Также мы установим библиотеку для шрифтов — Font Awesome"

  • Урок 10. Блок пакетов.

В этом уроке вы увидите, как можно сверстать блок пакетов или тарифов. В данном уроке мы создадим новый миксин, который позволит очень сильно сократить код в зависимости от модификатора на элементе"

  • Урок 11. Блок о нас.

В данном уроке будет сверстан блок макета «О нас»

  • Урок 12. Блок слайдера.

В данном уроке мы сверстаем слайдер и добавим 3 слайда, но пока без функционала"

  • Урок 13. Блок преимущества.

В данном уроке мы сверстаем довольно простой блок преимуществ, в котором снова будем использовать иконки Font Awesome"

  • Урок 14. Блок подвала.

Данный урок посвящен блоку подвала или футера, который будет являться заключительным для макета"

  • Урок 15. Функционал слайдера и продакшн сборка.

В этом уроке мы с вами сделаем продакшн сборку, то есть удалим всю ненужную информацию из CSS файла и сократим его размер в 4 раза! А еще мы напишем на чистом JavaScript функционал для слайдера"

► Вы с нуля увидите, как создать максимально эффективное рабочее окружение для верстки. Синтаксис используемый в блоке — SCSS, который является более строгой версией языка SASS.

  • БЛОК 5. Практика. Препроцессор LESS

Методология, выбранная для данного блока — наследование. Вы увидите, как просто и правильно совместно с препроцессором использовать данную методологию, и как такой подход позволяет сократить количество классов и максимально очистить html. Также вы увидите, как можно подключить специальную библиотеку шрифтов-картинок и тем самым оптимизировать размер таблицы стилей. После задания всех стилей мы буквально за пару секунд с помощью сборщика сделаем финальную сборку в один файл, и вы увидите, как это важно, потому что результат шаблона не изменится, а размер файла сократится почти в 4 раза.

  • Урок 1. Вводный.

В данном вводном уроке вы увидите шаблон, который нам предстоит сверстать. Вы узнаете, с помощью какой методологии будет сверстан данный макет, и каким изменениям он будет подвержен"

  • Урок 2. Настройка рабочего окружения.

В этом уроке вы увидите профессиональную настройку сборщика Gulp для автоматизации процессов при верстке на CSS препроцессоре"

  • Урок 3. Создание миксинов и параметров проекта.

В данном уроке вы узнаете, какой первый шаг стоит сделать перед началом процесса верстки. В процессе урока мы зададим общие стили для проекта, создадим файл параметров и сделаем пару необходимых базовых миксинов"

  • Урок 4. Блок навигации.

В данном уроке нами будет сверстан блок навигации. Также мы рассмотрим способ добавление иконок из шрифта Font Awesome"

  • Урок 5. Блок хедера.

В этом уроке мы сверстаем блок хедера. Также мы добавим общий класс для кнопок на весь проект"

  • Урок 6. Блок функций.

В данном уроке вы увидите, как сверстать блок функций, и как совместить картинку и текст"

  • Урок 7. Блок преимуществ.

В данном уроке мы продолжим верстку макета с блоком преимуществ"

  • Урок 8. Блок решений.

В данном уроке мы сверстаем довольно интересный блок с тремя элементами. В рамках урока будет затронута тема: как создать трапецию на чистом CSS"

  • Урок 9. Блок автора.

Данный урок посвящен блоку с текстом и описанием автора"

  • Урок 10. Блок шагов.

В этом уроке мы сверстаем блок с тремя элементами с разным наполнением, но одинаковым каркасом"

  • Урок 11. Блок подвала.

Этот урок, финальный в плане верстки, будет посвящен подвалу или футеру макета. Также мы создадим еще один миксин"

  • Урок 12. Финальная сборка.

В этом уроке мы сделаем продакшн сборку — сделаем минификацию файла CSS и уберем исходные карты, написав всего одну строчку кода. Вы увидите, как данная оптимизация применима на практике, и насколько она важна"

► Вы с нуля увидите, как организовать максимально эффективное и быстрое рабочее окружение для верстки с использованием препроцессора и сервера быстрой автоматической перезагрузки страницы. Также мы заложим функционал для создания финальной версии сборки стилей в один файл.


Видеокурс
Видео урок


Видеокурс "Препроцессоры SASS и LESS. Автоматизация Front-end разработки". (Владилен Минин - Webformyself)


Это уникальный видеокурс на рынке Рунета, который во всех подробностях дает теоретическое и практическое освещение всех возможностей двух наиболее популярных и востребованных на рынке CSS-препроцессоров SASS и LESS в рамках единого курса.....


Страница курса - Препроцессоры SASS и LESS. Автоматизация Front-end разработки. (Владилен Минин - Webformyself)

Видеокурс
Видео урок


Видеокурс "FullStack-Мастер. Разработка CRM-системы на Node.js, Express, Angular6". (Владилен Минин - Webformyself)


Проинвестировав один раз сравнительно скромную сумму,вы получите фундаментальный пошаговый видеокурс с уникальным,качественным,структурированным материалом на русском языке. Мы не нашли подробных, систематичных, качественных материалов на русском языке...


Страница курса - FullStack-Мастер. Разработка CRM-системы на Node.js, Express, Angular6. (Владилен Минин - Webformyself)

Видеокурс
Видео урок


Видеокурс "WordPress-Мастер: разработка тем для WordPress". (Андрей Кудлай - Webformyself)


Видеокурс «WordPress-Мастер: разработка тем для WordPress» состоит из трех частей: одной теоретической и двух практических. Приобретая данный курс, вы получаете целостный продукт, в котором есть все необходимое для изучения и работы с WordPress......


Страница курса - WordPress-Мастер: разработка тем для WordPress. (Андрей Кудлай  - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "Angular 4: быстрый старт, первые результаты". (Владилен Минин - Webformyself)


Данный курс посвящен очень популярной технологии от компании Google-Angular 4.Angular - это javascript фреймворк, который позволяет делать реактивные сайты - Single Page Applications. В процессе данного курса мы рассмотрим базовые возможности Angular 4...


Страница курса - Angular 4: быстрый старт, первые результаты. (Владилен Минин - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "Практика верстки сайта-лендинга с нуля до результата". (Денис Булыга - Webformyself)


В данном видеокурсе мы c нуля сверстаем PSD-макет, используя технологии HTML5 и CSS3, научимся вырезать изображения из макета. При верстке будет соблюдена структура проекта, используя для каждого блока отдельный файл со стилями. По результатам данного....


Страница курса - Практика верстки сайта-лендинга с нуля до результата. (Денис Булыга - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "React JS. Основы". (Владилен Минин - Webformyself)


Данный мини-курс посвящен JavaScript библиотеке ReactJS, разработанной компанией Facebook. В этом курсе вы познакомитесь с базовыми возможностями React, начиная с определения концепта компонентов в веб-разработке и заканчивая разработанным приложением....


Страница курса - React JS. Основы. (Владилен Минин - Webformyself)

Видеокурс
Видео урок


Видеокурс "React JS с Нуля до Профи. Полное руководство для современной веб-разработки". (Владилен Минин - Webformyself)


React — обязательный инструмент для современного разработчика React — это библиотека JavaScript с открытым исходным кодом, которая используется для создания пользовательского интерфейса. Она была создана компанией Facebook и представлена разработчикам....


Страница курса - React JS с Нуля до Профи. Полное руководство для современной веб-разработки. (Владилен Минин - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "Препроцессоры. Быстрый старт". (Владилен Минин - Webformyself)


Забирайте БЕСПЛАТНО пошаговый мини-курс по основам верстки с использованием CSS-препроцессоров – от одного из наиболее авторитетных издательств Рунета для веб-мастеров. В этом курсе вы на наглядном примере простого сайта с двумя разными темами увидите....


Страница курса - Препроцессоры. Быстрый старт. (Владилен Минин - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "Full-Stack практика. Создание JavaScript блога". (Владилен Минин - Webformyself)


Данный курс посвящен теме Full-Stack разработки на JavaScript и знакомства с ней. В курсе мы разработаем небольшой блог, на примере которого мы разберем базовые составляющие Full-Stack разработки. В первую очередь мы реализуем сервер, который будет......


Страница курса - Full-Stack практика. Создание JavaScript блога. (Владилен Минин - Webformyself)

Видеокурс
Видео урок


Видеокурс "Фреймворк VUE JS. Полное руководство для современной веб-разработки". (Владилен Минин - Webformyself)


Курс состоит из 2-х больших блоков: теория и практика. Изучив теоретический блок, вы получите актуальную исчерпывающую теоретическую базу по состоянию на апрель 2018 года (к которой сможете возвращаться при необходимости в будущем – в качестве удобного...


Страница курса - Фреймворк VUE JS. Полное руководство для современной веб-разработки. (Владилен Минин - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "VUE JS – быстрый старт, первые результаты." (Владилен Минин - Webformyself)


Данный курс посвящен самому быстрому javascript фреймворку - Vue JS. В рамках данного курса в 6 практических уроках мы создадим динамическое веб-приложение, где пошагово разберем на простых примерах, как работает фреймворк Vue.


Страница курса - VUE JS – быстрый старт, первые результаты. (Владилен Минин - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "Создание Telegram бота". (Владилен Минин - Webformyself)


В процессе данного курса вы познакомитесь с основными понятиями, необходимыми, для создания ботов. Вы узнаете, как регистрировать бота в Telegram, получив его токен для выполнения запросов на API Telegram....


Страница курса - Создание Telegram бота. (Владилен Минин - Webformyself)

Видеокурс
Видео урок


Видеокурс "Telegram-бот мастер. Практический курс создания бота. Телеграм bot". (Владилен Минин - Webformyself)


Данный курс посвящен разработке Telegram-ботов на платформе NodeJS. Курс состоит из 3 частей, которые подробно и структурировано обучат вас создавать ботов с полного нуля....


Страница курса - Telegram-бот мастер. Практический курс создания бота. Телеграм bot. (Владилен Минин - Webformyself)

Видеокурс
Видео урок


Видеокурс "Angular 4 c Нуля до Профи. Полное руководство для современной веб-разработки". (Владилен Минин - Webformyself)


Angular — это JavaScript-фреймворк с открытым исходным кодом. Создан он компанией Google для создания клиентских приложений. Прежде всего, он нацелен на разработку SPA-решений (Single Page Application), то есть одностраничных приложений.....


Страница курса - Angular 4 c Нуля до Профи. Полное руководство для современной веб-разработки. (Владилен Минин - Webformyself)

Видеокурс
Видео урок


Видеокурс "JavaScript. Полное руководство для современной вебразработки". (Владилен Минин - Webformyself)


Данный курс – это полный охват теоретических и практических знаний и навыков по JS – без воды и в концентрированном виде. В курсе собраны лишь самые актуальные и востребованные в 2019 году знания по JS – для современной веб-разработки.


Страница курса - JavaScript. Полное руководство для современной вебразработки. (Владилен Минин - Webformyself)

Видеокурс
Видео урок


Видеокурс "Фреймворк Nuxt.js. Руководство по FullStack-разработке". (Владилен Минин - Webformyself)


Nuxt.js — это фреймворк высокого уровня, который создан с целью улучшения библиотеки Vue.js. Nuxt — это удобный инструмент, который позволяет быстро и относительно легко создавать действительно сложные приложения. Это основа для более простого создания...


Страница курса - Фреймворк Nuxt.js. Руководство по FullStack-разработке. (Владилен Минин - Webformyself)

Видеокурс
Видео урок


Видеокурс "Технология CSS Grid. Руководство по адаптивной верстке". (Денис Булыга - Webformyself)


В видеокурсе находится вся необходимая информация, как для новичков, так и более продвинутых разработчиков, изучив которую, можно начать самостоятельно заниматься версткой сайтов c нуля на достаточно продвинутом уровне. Благодаря курсу новички в сжатые...


Страница курса - Технология CSS Grid. Руководство по адаптивной верстке. (Денис Булыга  - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "Server Side Rendering с Nuxt.js. Быстрый старт". (Владилен Минин - Webformyself)


Данный вводный курс расскажет вам про то, что такое Server Side Rendering, почему его стоит изучать и внедрять в свои проекты уже сейчас и какие плюсы вы получите, используя данную технологию. Вы узнаете про фреймворк,позволяющий очень просто создавать...


Страница курса - Server Side Rendering с Nuxt.js. Быстрый старт. (Владилен Минин - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "JavaScript. Быстрый старт". (Владилен Минин - Webformyself)


Данный видео курс предназначен для новичков, которые хотят выучить язык JavaScript. В этой серии уроков вы увидите, как разрабатывается простое веб-приложение, которое позволит обрабатывать фотографии с помощью JavaScript в динамическом режиме.....


Страница курса - JavaScript. Быстрый старт. (Владилен Минин - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "Фреймворк Bootstrap 4. Быстрый старт". (Андрей Кудлай - Webformyself)


Представляем вам мини-курс «Bootstrap 4. Быстрый старт». Курс включает в себя 9 небольших уроков общей продолжительностью почти 2 часа. В курсе показана верстка макета из PSD с применением CSS-фреймворка Bootstrap 4. Bootstrap – это популярнейший......


Страница курса - Фреймворк Bootstrap 4. Быстрый старт. (Андрей Кудлай - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "Верстка сайта на Grid. Быстрый старт ". (Денис Булыга - Webformyself)


В этом цикле уроков будет показана верстка PSD-макета при помощи современных Web-технологий на чистом HTML и CSS без использования препроцессоров, автоматизации и других дополнительных возможностей. В целом макет является довольно простым, но на его .....


Страница курса - Верстка сайта на Grid. Быстрый старт. (Денис Булыга  - Webformyself)

Видеокурс
Бесплатный видео урок


Бесплатный видеокурс "NodeJS. Быстрый старт". (Владилен Минин - Webformyself)


Данный курс по основам NodeJS является практическим, в результате которого вы увидите, как пишется консольное приложение, позволяющее взаимодействовать с файловой системой. Увидите, как через консоль добавлять новые заметки, читать уже существующие......


Страница курса - NodeJS. Быстрый старт. (Владилен Минин - Webformyself)

Видеокурс
Видео урок


Видеокурс "NodeJS. Полное руководство". (Владилен Минин - Webformyself)


В курсе предоставлена информация от самых основ, от установки самого NodeJS, до деплоя готового приложения и размещения его на сервере. Кульминацией практической части курса является создание большого статического интернет-магазина и сложного REST API....


Страница курса - NodeJS. Полное руководство. (Владилен Минин - Webformyself)

Видеокурс
Видеокурс


Видеокурс "React JS, Redux, ES2015 с Нуля до Гуру". (Михаил Русаков, Владилен Минин)


Данный курс-это обширный курс по JavaScript и фреймворку React, который позволит Вам с нуля создавать мощные современные, динамические JavaScript-приложения. Вы узнаете о тонкостях работы с "профессиональным" JavaScript,а так же узнаете о нововведениях...


Страница курса - React JS, Redux, ES2015 с Нуля до Гуру. (Владилен Минин)
КОЛЛЕКЦИЯ БЕСПЛАТНОГО ВИДЕО

Если Вы не нашли видео на сайте то воспользуйтесь наши каналом с большим количеством разнообразных видео курсов на различные темы

Смотреть видео Смотреть видео

Видеокурс "Препроцессоры SASS и LESS. Автоматизация Front-end разработки". (Владилен Минин - Webformyself)
Страница курса - Препроцессоры SASS и LESS. Автоматизация Front-end разработки. (Владилен Минин - Webformyself)

ПОПУЛЯРНЫЕ КНИГИ, КУРСЫ И ТРЕНИНГИ

Видеокурс Видео урок
Видеокурс Видеокурс
Видеокурс Видео урок
Видеокурс Видео урок
Видеокурс Бесплатный видеокурс
Видеокурс Видеокурс

БЕСПЛАТНОЕ ВИДЕО, МИНИ - КУРСЫ

Промо ролики видеокурса JavaScript. Быстрый старт. (Владилен Минин - Webformyself)
Промо ролики видеокурса Server Side Rendering с Nuxt.js. Быстрый старт. (Владилен Минин - Webformyself)
Промо ролики видеокурса Full-Stack практика. Создание JavaScript блога. (Владилен Минин - Webformyself)
Промо ролики видеокурса Server Side Rendering с Nuxt.js. Быстрый старт. (Владилен Минин - Webformyself)
Промо ролики видеокурса Препроцессоры. Быстрый старт. (Владилен Минин - Webformyself)
Промо ролики видеокурса React JS. Основы. (Владилен Минин - Webformyself)