Gulp 2024, полное руководство, современный синтаксис
HTML-код
- Опубликовано: 3 мар 2023
- Обновленная начальная сборка по gulp 4. Создал сборку для дальнейшего масштабирования и верстки проектов на канале.
Видео о препроцессорах:
• Препроцессоры SCSS/SAS...
Node: nodejs.org/en/
Gulp: gulpjs.com/
npm: www.npmjs.com/
git: git-scm.com/
Мой патреон:
/ from0to1
0:40 - Что такое Gulp
3:17 - Как установить Gulp
17:38 - Как установить Gulp локально
20:30 - Создание структуры папок
26:32 - Установка плагина gulp-sass и sass
40:24 - Установка плагина gulp-concat
44:40 - Установка плагина gulp-uglify-es
52:00 - Добавление функции watch
57:06 - Установка плагина browsersync
1:10:20 - Добавление функции parralel
1:17:00 - Установка плагина gulp-autoprefixer
1:22:50 - Как поключить несколько файлов js
1:29:55 - Как подключать css из библиотек
1:34:45 - Как настроить билд
1:39:05 - Установка плагина gulp-clean
1:42:30 - Добавление функции series
1:47:18 - Как использовать сборку на практике
Подпишитесь на канал, если вам понравилось данное видео:
bit.ly/2IFzwBZ
0:40 Что такое Gulp
3:17 Как установить Gulp
17:38 Как установить Gulp локально
20:30 Создание структуры папок
26:32 Установка плагина gulp-sass и sass
40:24 Установка плагина gulp-concat
44:40 Установка плагина gulp-uglify-es
52:00 Добавление функции watch
57:06 Установка плагина browsersync
1:10:20 Добавление функции parralel
1:17:00 Установка плагина gulp-autoprefixer
1:22:50 Как поключить несколько файлов js
1:29:55 Как подключать css из библиотек
1:34:45 Как настроить билд
1:39:05 Установка плагина gulp-clean
1:42:30 Добавление функции series
1:47:18 Как использовать сборку на практике
Красава!
Такой стиль вечеринки помогает оставаться в фокусе и смотреть все два часа, почти не прерываясь на что-то развлекательное. Огромное спасибо, Вадим, за стиль, простые слова для сложных понятий и всегда актуальный контент!
Вадим! хочу поблагодарить, за то что человеческим языком ты объясняешь все, уже на протяжении многих лет)) если на горизонте появляются люди которые спрашивают меня, мол а как тут сверстать, а как тут сделать, даю им моментальную наводку на твою вечеринку))Луплю тебе ЖИРНЫЙ (прям такой с font-weight: 700) лайк)) Желаю успехов тебе и здоровья !!!
А чё не font weight 900?
@@centralcat3325 Чтобы было к чему стремится )) на разборе webpack`а 900ый будет
Благодарю
Огромное спасибо за уроки! Лучший на ютубе! Пусть вечеринка никогда не заканчивается!
Все ещё пользовалась твоей старой сборкой, пыталась пару раз перейти на чужие сборки, но твой самый понятный. Спасибо большое, что выложил обновленную версию❤
Вадим ,огромное спасибо за труды! Новая сборка как раз в тему зашла,это шикардосно! Ты просто красавчик!
Вадим, огромное спасибо. После такой доступной и структурированной подачи информации хочется расти и развиваться дальше, потому что у тебя наконец-то получается!
Вадим, Вы просто чудо!!! Благодарю за знания ❤
После таких видосов осваивать Gulp стает очень просто. Всегда жду следующих выпусков. Спасибо за такую огромную работу!
Спасибо, Вадим!) Ждал от Вас именно этого видоса!)
Здоровья Вам и близким! :)
Благодарю
Вчера оставил коммент для продвижения видео, а сегодня посмотрел, и готов резюмировать.
Объяснено просто пушка, ты лучший, если кто-то скажет что не так, не верь им, у тебя талант, на расслабоне объяснять простыми словами, непростые вещи.
Вадим, спасибо тебе за то что ты есть! Я все обучалки по галпу пересмотрел, но так как они были загружены год назад и выше, у меня постоянно возникали ошибки на каждом этапе. Какое счастье было увидеть твое видео и повторяя твои действия, видеть что все работает. Это просто Новый Год какой то, у меня просто снос кабины от счастья! Спасибоооо :3
огонь
Всегда актуальные руководства и темы для совершенствования знаний, спасибо большое за твою работу и вечеринки с божественными напитками никогда не надоедают!
Спасибо огромное!!! Так хорошо, понятно и с юмором объясняете!!! У Вас талант преподносить сложные вещи простым языком!!! Сборка отличная!!! Хочется продолжения по gulp 2023!!!
Большая благодарность Вадиму! Конечно же ждём продолжения, картинки, шрифты, всё что используется в современных сборках хотелось бы здесь видеть, еще хотелось бы пояснения как с этим можно взаимодействовать с React. Отдельное спасибо за подачу материала, все очень понятно и доходчиво даже для новичков, кем я и являюсь собственно :D
Бомбовая вечеринка, бомбовый Вадим) Большое тебе спасибо!
Жду продолжения, а ещё хотелось бы вебпак от тебя увидеть, объясняешь супер!
Благодарочка Вадиму! Начинал с твоих видео во frontend. Самый веселый и очень харизматичный человек. Твои вечерники останутся навсегда в моем сердце)) Не хватает конечно курсов по React, NextJs, NodeJs, TS и других. Огромное тебе спасибо, без тебя я бы шатался на старой не любимой работе!
спасибо
Вадим, спасибо за вечериночки! Один из немногих блогеров, которых приятно и весело слушать.
Вадим, огромное тебе спасибо! Три дня мучался делая другие сборки. Нечаянно попалось твоё видео, и не жалею. Скоро начну второе видео смотреть)) Однозначно лайк за такой качественный труд и его доступность.
Огромная благодарность и лайк за проделанный труд. Всё чётко и понятно. С нетерпением жду масштабирование сборки
Вадим! Ты красавчик, каких не видывал RUclips. Ты делаешь сложное простым и понятным. Просто как ручка крана, открываешь и водичка течёт. Та форма подачи информации, которой ты мастерски орудуешь, как самурай катаной (с юмором и понятными терминами), льется как песТня в наши уши. И мы в ритме танца... Спасибо тебе за такую найлэпшу вечеринку. Здоровья, успехов в дизайне макетов (ждём это чудо) и только вперёд!
Благодарю
Огромное спасибо. Очень жду развития сборки!
Обязательно продолжайте, Вадим. Маялась с этим галпом месяц, и вот, наконец, удалось всё установить. Спасибо!
круть
Большое спасибо за такой ценный труд.❣ Всегда интересно слушать
Спасибо тебе огромное, так всё чётко объясняешь. И юмор у тебя что надо :) Приятно слушать, хорошо речь поставлена. Удачи в развитии канала!
Вадим разбор крутой
Будет круто теперь марфон устроить с этой сборкой
Ну и ожидаю в будущем работу с webpack увидеть
💪💪💪👍👍
Спасибо! Без воды, всё как надо! Хотелось бы в следующих видео увидеть реализацию сборки под мультистраничный сайт и подключение конкретных файлов скриптов и стилей к конкретным страницам, а не все стили и скрипты ко всем страницам:) Еще раз спасибо за труд!
Ну js допустим закешируеться на главной, Смысл подключать разные
Вадим, спасибо! Очень жду видео с расширением сборки!
Да-да, тоже за расширение!)
Спасибо. За работу, за полезность, подробные объяснения. Отдельная благодарность за юмор. Жду дальнейших работ.
Спасибо тебе за объяснение сложных вещей понятным языком. Надеялся что ты уже будеш делать сборку на модулях ЕS6, с файлами конфигурации и условиями исполнения тех или иных тасок
Спасибо Вадим! 🤩👌
Безусловно жду с нетерпением продолжения!
Низкий поклон, рад видеть тебя в добром здравии!
Когда ожидать дальнейших видео? Очень полезно, не затягивай пожалуйста!)
Первый раз услышал об Gulp. Было очень интересно посмотреть. Спасибо за ролик!
Спасибо огромное. Куча материала в интернете, которые чуть ли не через раз дают ошибки. Твои уроки лучшие. Всегда все работает, все понятно и новичкам и полезно для профессионалов! Лайк пребольшой) и респект)
Вы потрясающий 😄. Подписалась через несколько минут видео. Очень живой и харизматичный, подняли настроение, рассказываете живо и интересно, не заскучаешь, спасибо!
Самый мощный мини-курс по Gulp, у Вас очень хорошо получается объяснить сложные вещи на понятном языке, автору моё почтение. С нетерпением жду следующие "вечеринки".
благодарю
Ещё отдельное огромное спасибо за пояснение работы на мак. Я столько мучилась при первых попытках, что-то сделать и получить в этом терминале.. не описать всю мою боль
круть, все порешали
Да ладно , только сел искать свежее видео по gulp )))
хух, успел отснять до момента твоего поиска =))
Дуже вам дякую. З нетерпінням чекаю наступні відео, щоб вже з оновленим галпом попрактикувати ваш багатосторінковий макет
Вах, спасибо. Во вкладках лежит твой предыдущий видос про Галп, все никак не посмотрю, теперь обновлю вкладки. Но на днях надо заставить себя разобраться
Спасибо большое за сборку! И формат видео понравился, в общем ждём продолжения!!!
спасибо, на текущий момент лучшее видео из тех что я смог найти!
В каких-то моментах отходил от видео и делал как в примерах на npm к каждому пакету.
Пушка-гонка!!! Пробовал собрать по предыдущему видео. Куча ошибок повычкакивало. С эти всё чётко получилось. Огромное спасибо за труд!!!
Вадим! Спасибо за информативные, умные и человеческие объяснения❤
Рад что ты вернулся. Даешь вечеринку))
Думаю нужно ещё добавить шрифты, изображения, видео, аудио файлы (как их сжимать и вставлять проект). Есть же ещё модульное подключение, интересно узнать через import или require быстрее будет работать сборка. Ну и сам webpack погрызть надо, а ещё показать как его связать с gulp. Супер ролик, жду продолжение)
Большое спасибо
Жду следующего выпуска !
Вадим, огромная благодарность за то, что ты делаешь! За отличную подачу, разъяснения и юмор. С нетерпением жду новых роликов! Вдохновения тебе!🪄
Благодарю
Спасибо большое! Ждем продолжения😊
добрый день, огромное спасибо за такое подробное видео.
очень жду развития этой сборки!!! класс)
уже есть на канале
Спасибо за проделанную работу)
По прежнему жду курс по прокачке новичков на новый уровень! Не знаю зачем мне, разработчик должен развиваться сам, наверно просто соскучилась за вашей командой! У меня был самый лучший ментор, я получила не только знания а и огромное удовольствие! Так что жду с нетерпением новость о новом курсе! Вам удачи и только развития, развития, развития
Благодарю
Вадим, спасибо огромное за класнный и очень полезный видос!
Вдруг, кто-то столкнулся с такой-же проблемой как у меня, что при запуске функции build консоль выдаёт ошибку и ругается на autoprefixer, то просто сделайте откат до 8-й версии. Мне, это помогло.
Спасибо за отличное видео. Посмотрел до конца. GULP установил. Все работает. Жду следующую серию. Вадим, ты крут!
молодцом
Большое спасибо за труд и отличное объяснение. Это было моё первое знакомство с gulp
Спасибо большое за подробное объяснение. С нетерпением жду следующего видео.
Большое спасибо за Ваши обучающие видео!
Спасибо за твои видео, дружище. Всё очень по теме и полезно. Всё ещё ждём видео по натяжке вёрстки многостраничного сайта на wordpress!
Вадим,добрый день)видео супер,ждём продолжения вечеринки))
Как раз не хватало такого подробного объяснения. Спасибо большое
Спасибо большое за твои видео, ты просто мастер, очень кайфово слушать твои объяснения
Посмотрел видос как новый фильм Мстителей))) не отрываясь от манитора😅 Вадим огромное спасибо))😊
Просто и понятно! спасибо! Жду следующее видео на эту тему!
Супер видео. Давно все ждали) Спасибо огромное)
Спасибо за урок! Перехожу с версии 3.9 на 4 - синтаксис очень сильно изменился. Благодарю, все получилось.
Что за судьба такая? Как раз начал смотреть старый видос по галпу, и тут обновочка. Вадимыч, спасибо!
все свявзано=)
Просто нереальный контент. Спасибо огромное
Делай все, что есть по галпу.
Спасибо, Вадим, за ваш труд, всё очень полезно и очень понятно))
Вадим доброго времени суток! Ты просто Большой Молодец, я с Галпом давно пытаюсь подружится поскольку понял как он облегчает повседневную рутинную работу фронтовиков, и ролики по сборкам смотрел у многих но постоянно там вылазили какие то косяки возможно из-за того что это были более старые видео и что то уже работало так после обновления версий - не знаю, а вот твой урок прошел без запинки, а в твоем стиле подачи очень легко и приятно это было смотреть, спасибо тебе за твой труд, очень благодарен, надеюсь что ты продолжишь расширять эту сборку я с удовольствием сделаю ее своей основной стартовой на каждый день.
P.S. С нетерпением жду нового видео по данной теме или с применением этой сборки уже в твоем практическом уроке).
Повернувся до навчання після довгої стагнації. Шкода що доступ до попередньої платформи більше не надається, там було багато інформації :)
Дякую за ваш титанічний труд друже! Успіхів і натхнення вам та вашій дружині ( її уроки теж дуже корисні та інтенсивно розвивають в дизайні) о/
Как всегда лучший!! Спасибо огромное за твой труд!!
я не могу!)) еще не досмотрела и вот хочется прям процитировать фильм "Свадьба в Малиновке": "Вы же вундеркинд! Слушайте, Вадим, и шо я в вас стала сразу такой влюбленной?!" точнее в ваш труд, юмор, и легкую подачу. ❤ вот прям с первых минут в ритме танца и не хочу никуда деваться!😄 Спасибо, Вам, ОГРОМНОЕ! все, я дальше на вечеринку))
Огромное спасибо! Невероятно полезный урок!
ОЧЕНЬ понятно и доступно подан материал! СПАСИБО!
Одно из лучших видео, если не лучшее для знакомства с Gulp. Спасибо!
Благодарю Вас Вадим, за Ваши уроки, за Ваши знания и за то что делаете людей умней и богаче респект Бро! 🙏🤝💥 Всех благ, Вам и Вашей семье! 🙏 Ас-саляму алейкум!!! 🤝
Вечеринка что надо! Спасибо тебе!
спасибо
Вас так интересно и приятно слушать что я посмотрела все видео, правда, на скорости 1.5 :). У вас очень хорошо и доступно получается излагать материал. Как говорил когда-то мой тим лид архитектору : "Объясняй мне так как будто я совсем тупой". Вот вы объясняете именно так. Спасибо за ваш труд и интересные ролики
Благодарю
Дуже зрозумілими словами і максимально оптимальним темпом про такі важливі речі.
Лайк ОДНОЗНАЧНО!!!
Я всегда мечтал так разговаривать) По приколу все четко и понятно объясняет. Респект))!!
Спасибо Вадим! Теперь можно и многостраничный делать👍
Спасибо большое за такое подробное видео! Очень интересно и познавательно!
Отличное видео, жду продолжения, хочется сделать себе норм сборку в 2023году) Огромная благодарность за видео! Успехов!
спасибо, сделаем
Спасибо. Как всегда всё понятно и интересно.
Как-то случайно попал к вам на вечеринку, но уверен, что останусь :)
*словарный запас пополнен* =)) Это наверное десятый твой ролик +- к ряду просмотренный, что то знал, что то не знал, смотрю с удовольствием все впитываю, в закладки добавляю. Спасибо!
спасибо Вадим, как всегда нужная информация
Спасибо за видео,все понятным языком,по делу без воды!👍
Добрый день , очень хорошее пояснение,ждём продолжения))
круть
Вадим, спасибо огромное за класнный и очень полезный видос!
Просто лучший, благодарим за то, что ты делаешь! :)
Благодарю
скинь пож исходник ?
Круууууууутоооооо Маэстро ,по вашему старому видео пытался настроить галп , но не получалось , полагаю это из-за неактуальных версий галпа в старом видео , спасибо Вадим
Вадим, ты просто замечательный человек! просто легеда! ты очень сильно мне да и многим тут помог! продолжай в том же духе пожалуйста!
Годный контент! Спасибо!!!
Шикарная вечеринка получается🎉
Cпасибо тебе, ты очень крутые и полезные вещи делаешь, респект!
Вадим, мое почтение все очень предельно ясно!
Большое спасибо! Жду продолжения
О, Вадим, у тебя уже 70 тысяч тусовщиков на канале) Приятно удивлен! Последний раз смотрел тебя на 10к ((
Большое вам спасибо за вашу работу