OptimizedHTML 4: Sass+Scss и немного пояснений. Дополнительный выпуск

524 ratings | 16517 views


OptimizedHTML 4: Sass+Scss и немного пояснений. Дополнительный выпуск

Полезно? Подпишись на канал: Создание интернет-магазина от А до Я: Создание новостного сайта от А до Я: Фриланс для начинающих: Страница выпуска: Обновленный стартер: Всем привет, дорогие друзья! Совсем недавно вышел в свет стартер OptimizedHTML с Bootstrap 4 и я уже получил огромный фидбек по данному стартовому шаблону. Сегодня я расскажу, какие изменения имеют место быть и поясню некоторые моменты, о которых меня спрашивают наиболее часто. Группа Вконтакте: Реклама на канале:

Comments to the video: OptimizedHTML 4: Sass+Scss и немного пояснений. Дополнительный выпуск

Alex Eska 5 months ago
пропали таски с деплоем и build
Atoom Otr 5 months ago
Алексей, благодарю за толковые объяснения ! А что за редактор у Вас в этом видео ?
Shuhratjan Nizamov 6 months ago
можно ли использовать функцию delegate() в js больше 30-40 один, мы попросту делаем веб-сайт без релоад, лишь на ajax запросом
Nurlan Orazov 7 months ago
будто упразднить минимизацию стилей при компиляции ?
Tatiana Covash 7 months ago
Алексей, помогите разобраться. В начале труд шла будто по маслу, однако стоило мне добраться до третьей секции будто обновления стали загружаться от 3 до 7 сек -это gulp и лишь чрез несколько секунд браузер мне показывал итог. Инспектировать элемент вообщем стало нереально, этак длительно загружается инспектор что можно сходить на кухню и сделаю чай. Я успела оценить достоинства этого шаблона, со всеми входящими и выходящими фишками) охото продолжать использовать, однако физическая память на приделе, зависает компьютер. Может оперативки не достаточно, у меня 6гб??? хотя по системным требованиям этого довольно. вирусов дудки. Что же не этак? Кто столкнулся с таковой неувязкой : SOS! Заранее благодарю!
Tatiana Covash 7 months ago
сколько нужно ? + 4 норм?
WebDesign Master 7 months ago
не достаточно
Marty Anddoc 8 months ago
Доброго времени суток,скажите изволь что это за файл таковой jquery.slim.min.js ? Для чего он нужен? Это заместо jquery-migrate ? Просто в jquery слабовато понимаю.Очень нужен ваш ответ,заблаговременно признателен.
Оксана Харитонова 8 months ago
Алексей, подскажите будто в этот штамп ввести bourbon. Прописываю @import bourbon выдает ошибку: Файл не найден
Михаил Ткач 8 months ago
проблема появился, а будто иной человек сжатые файлы стилей и скриптов вернуть для доработки сумеет?
WebDesign Master 8 months ago
Другой человек обязан получить все начальные материалы для предстоящей работы.
RySiK 2x 9 months ago
Подскажите изволь, уже нету команды будто в предведущей версии optimizedHTML 3 команда BUILD была, создавалась папка dist и в ней сжат полный код ??
Смирнов Павел 9 months ago
Алексей, хороший денек! Почему не используете при работе gulp-rigger? Ведь это весьма комфортно при многостраничном веб-сайте. Хотелось бы созидать его в вашем OptimizedHTML 4
Дмитрий Зацепин 9 months ago
Алексей, хороший денек. Подскажи изволь, будто сформировывать папку dist с итоговой версткой, не сообразил будто работает rsync. Спасибо. И еще проблема, в видео GULP для самых малеханьких был млмент по уменьшению размера фото для более резвой загрузки. Здесь я этак понимаю это не раализовано? Нет необходимости?
Станислав Радченко 9 months ago
а где build и папка дист? будто это всё на сервер скидывать? полную папку apps что-ли?
Станислав Радченко 9 months ago
сам для себя дурачина) проблема снят)
WebDesign Master 9 months ago
Это можно настроить на шаге деплоя, из папки app, фильтруя ненадобное. Как показала практика - это наилучшее решение, ежели build.
Ulanbek Jusupov 9 months ago
Ввел команду npm i, а пишет вот такую ошибку: 1957 error code ELIFECYCLE 1958 error errno 1 1959 error node-sass@4.9.0 postinstall: `node scripts/build.js` 1959 error Exit status 1 1960 error Failed at the node-sass@4.9.0 postinstall script. 1960 error This is probably not a problem with npm. There is likely additional logging output above. 1961 verbose exit [ 1, true ] Кто знает в чем неувязка?
Сергей Юрьевич 9 months ago
Обратил внимание, что сейчас функции lighten, darken не доступны. Возможно ли их подключить и будто это сделать?
Сергей Юрьевич 9 months ago
Допустил ошибку в синтаксисе, благодарю
WebDesign Master 9 months ago
Эти функции доступны.
Дмитрий Лавров 10 months ago
Доброго времени суток, сможете дать подсказку будто подключить к этому шаблону google карты, стандарный API JavaScript, при копировании кода с веб-сайта Google выдаёт ошибку initMap is not a function, что там не этак не усвою
WebDesign Master 10 months ago
Если is not a function - не подключена (либо подключена некорректно) библиотека ваших карт.
Arts to you 10 months ago
Ребята, подскажите, плиз. Насколько я сообразил, Алексей при верстке ссылки на пункты меню, посты и прочее, не ставит, они генерятся уже при компиляции проекта. Но там же необходимы опции, что бы линки вышли правильными. В каком видео про эти опции рассказывается? Не могу отыскать. Заранее признателен. :)
Azat Hemrayew 10 months ago
Здраствуйте Алексей не подскажите какие нибуть сервисы для скачка обычных PSD макетов для верстки для практики
Камо Абрамян 10 months ago
здрасти Алексей благодарю вам за задание!!. мне вот любопытно потом верстки когда штамп с командой gulp build собирать проект, autoprefixer не добавляет излишний код ? там же на проекте немало библиотеки и в конце они попадают main.min.css и там он на всех добавляет свои webkiti ? и можно удалит scss папку будто он не нужна
Andrew Vlasoff 10 months ago
Спасибо за хорошую сборку. Вопрос у меня по bootstrap. В папке libs лежат лишь стили scss. Всё понятно будто и что подключать, однако вот скрипты там не лежат. Т.е. я вообщем не сообразил, где они. Пришлось раздельно их закачивать и кидать в папку с JS. Как я понимаю, это не то, что думало. Подскажите, будто их подключать? А поточнее что я делаю не этак?
Илья Лекарев 10 months ago
Добрый денек! В одном из видео лицезрел js нотификатор (всплывающие извещение. Не могу припомнить в каком. Подскажите, изволь заглавие этого плагина и ссылку на видео где он употреблялся :)
Вадим Шорохов 10 months ago
скажите, отчего чрез gulp все скрипты и css работают корректно, а потом выгрузки на веб-сайте заместо стрелок слайдера видны кракозябры, а сам слайдер не работает из минифицированного comon.js, а работает лишь если скрипт слайдера выплеснуть из comon.js и воткнуть в html впрямую?
Дмитрий Зацепин 9 months ago
Алексей, хороший денек. Подскажи изволь, будто сформировывать папку dist с итоговой версткой, не сообразил будто работает rsync. Спасибо. И еще проблема, в видео GULP для самых малеханьких был млмент по уменьшению размера фото для более резвой загрузки. Здесь я этак понимаю это не раализовано? Нет необходимости?
Никита Кубарь 10 months ago
Алексей, как перспективен на Ваш взор интернет-дизайн на последующие несколько(10-15) лет?
WebDesign Master 10 months ago
Не вижу обстоятельств, отчего он не будет животрепещущ. Область в самом расцвете )
Владимир Горинов 10 months ago
Алексей, издавна смотрю ваши видео. Они попросту гениальны, однако одинешенек проблема вечно появляется. Недавно смотрел видео Html шорты от Html академии, и они всем рекомендуют перебегать на flexbox, считая их полностью достойной и легкой подменой бутстрапу и тд. Почему вы до сих пор верстаете лишь на сетке бутстрапа, ведь флексы уже имеют поддержку 98%. Это попросту дело привычки?
Николай Арнаутов 5 months ago
может быть он имел в виду css-grid, а не flexbox? Если конечно, то отчего не перебегайте на css-grid?
WebDesign Master 10 months ago
Bootstrap это весьма легковесный и удачный фреймворк. Создавая веб-сайт с нуля на флексах что этак, что этак поначалу необходимо сделать сетку. Зачем изобретать велик, если кушать такая восхитительная 12-колоночная типизация Дизайн > Вёрстка. Чистые флексы - это не подмена бутстрапу, вас дезинформировали.
Евгений 10 months ago
Было бы не нехорошо для less ещё сделать
reddev 24 7 months ago
npm i gulp-less --save-dev gulpfile - rename all sass/less
Ded Ded 10 months ago
Что Вы скажете о практике использования pug(jade) в проектах на bootstrap? Имеет это резон?
WebDesign Master 10 months ago
Я осуществляю посадку собственной верстки на фреймворки либо CMS. Поэтому необходимости во всем этом хозяйстве, которое предлагает Jade лично для меня, дудки.
Pavel NoneID 10 months ago
Как сейчас быть c FontAwesome, а конкретно с новейшей версией. Как ее ввести сюда.
Bogdan Bodik 10 months ago
Привет всем! Меня зовут Богдан, занимаюсь дизайном веб-сайтов будто хобби (не мастерски), однако меня попросили сделать маленький редизайн веб-сайта с экскурсиями по областям, труд не весьма непростая попросту люд желают малость переработать наружный облик и добавить пункт под доп. Контент, однако неувязка в том что за средства я дизайн не делал и даже приблезительных расценок не знаю. Может кто порекомендовать сколько необходимо хватать за Небольшой редизайн, беря во внимание что это 1-ый заказ
Сергей Протос 10 months ago
Зависит от ваших и заказчика способностей. Вы же осознаете, что дизайн не измеришь объемом либо метражом). Критериев практически дудки. А от тех, что кушать, можно(а время от времени и необходимо) отступить. Так будто вы начинающий(будто и я вобщем))), вам на данный момент важнее эксперимент, ежели средства. Посему именуйте стоимость, чтоб не отпугнуть заказчика, а уж позже чтоб не оскорбить себя. Ну эт мое мировоззрение. Мне будто для выработки портфолио можно и безвозмездно, что-то поделать друзьям-знакомым, ну-ка либо за символические средства. Это покамест. Потом будто заматереешь, будешь апать прайс. Ну у меня, по последней мере, таковой план в отношении себя). Это будто с живописью(малость пишу маслом), полотно стоит столько, сколько за нее готовы уплатить. Иногда откровенная хрень может стоить дурных бабок и напротив. А этак гляньте на фриланс биржах почем там делают подобные макеты. Можете кликнуть такую же стоимость либо рядышком. Если я не прав пускай меня поправят, те кто издавна в теме. Сам нередко маюсь: сколько упрашивать средств.
Ирина Джумарик 10 months ago
Расскажите про бэм и давайте начнем его использовать в проектах
Сергей Протос 10 months ago
про БЭМ плюсую гневно.
Максим Шипица 10 months ago
Хотелось бы выяснить у вас что вы думаете про бэм и будто верно строчить код на бэм!!!!
Maksim Ziankovich 11 months ago
Строчка 15, нужна точка с запятой ; 2:16
WebDesign Master 10 months ago
Не непременно, однако можно и поставить. Последний либо один-единственный элемент в отбивке не нуждается, однако обновлю, благодарю.
Dmytro Mazun 11 months ago
Ребята, будто в галпе лучше итого сделать многостраничный веб-сайт? Через rigger либо будто-то по другому?
WebDesign Master 11 months ago
Лучше Jekyll для статики ещё ничего не выдумали.
Anton Noginov 11 months ago
Привет Алексей. Напиши изволь а когда будет новые версии ведео по верстки?
semurei jeck 11 months ago
Как существование? В голосе будто как будто больше жизни появилось
WebDesign Master 11 months ago
Да будто обыкновенно все пять )) Выспался в конце концов наверняка ))
Валентин Инкогнито 11 months ago
Ещё бы stylus и pug добавить. *мечтательно
Atoom Otr 5 months ago
За PUG. Хотелось бы лучше его выяснить, конкретно от WebDesign Master Ну-у-у весьма толково всё разъясняется.
Георгий Склаво 11 months ago
Я бы всё-таки желал возвратить билд в галп. Так будто он особо не мешает, а вот если нужно скопить проект весьма комфортно.Попробею ввести без помощи других)
Георгий Склаво 10 months ago
WebDesign Master Спасибо за ваши разъяснения, потом которых я могу это сделать сам)
WebDesign Master 11 months ago
Конечно, кастомизируйте под ваши нужды. Билд это личная история.
Руслан Семенов 11 months ago
Спасибо за труды! Хотел попросить совета из опыта, на сколько проблематично если я дописываю в каждом проекте слежение за php (gulp.watch('app/**/*.php', browsersync.reload);) и jpg по аналогу, у меня локально дудки заморочек, из-за чего они не добавлены в стартовом шаблоне? Вы их попросту не используете либо кушать минусы?
Руслан Семенов 11 months ago
Спасибо, принял, ответ понятен.
WebDesign Master 11 months ago
Это легкая кастомизация для отдельного личного варианта, коих может быть 1000. Если все включить в базисный штамп, он будет нужен сразу всем и никому в частности, он будет попросту перегружен излишним. Задача в том, чтоб облегчить старт работы над проектом и выключить рутину в начале работы.
Руслан Семенов 11 months ago
Да я смотрел, лайк стоит, видимо уже издавна. Я то спрашиваю отчего их дудки в стартовом, это нагружает либо попросту дудки надобности у Вас ? )
WebDesign Master 11 months ago
По этой теме кушать отдельное видео:
Евгений Ларков 11 months ago
Автор весьма отлично и толково подаёт информацию. Многим кто ведёт подобные каналы нужно у создателя миновать тренинг по подаче инфы своим юзерам ))
Duskull 11 months ago
Опечаточка в заглавии ссылки, projectmane
WebDesign Master 11 months ago
Спасибо! Вы весьма внимательны.
Богдан Писанюк 11 months ago
.не прошло и месяца, будто вы меня. уже ****** ахаха весьма искусно сделали паузу!
Alex Elkin 10 months ago
а мне показалось еле сдержался =)
Артём Триколич 11 months ago
Как вечно молодчина. Спасибо за старания. Добавишь плагин на сжатие картинок? Было бы круто если была бы гипотиза для susy. Кстати, что ты о ней думаешь? Когда jekyll выйдет?)
Вадим Сиваченко 11 months ago
папку с sass можно выслать?
Андрей Пашко 11 months ago
Спасибо за видео!
Денис Стащенко 11 months ago
А сколько по времени работает ссылка tunnel ?
Mischael Chicago 11 months ago
А что там с jekyll? Курс будет?
WebDesign Master 11 months ago
В реальный момент это главная задачка.
Sergei Verenikin 11 months ago
Спасибо, воспользовался вашим предшествующим собирателем с синтаксисом scss return gulp.src('app/sass/**/*.+(scss|sass)')
AndreyGovorukhin 10 months ago
а что означает (scss|sass) ? будут записываться файлы будто.sass этак и.scss?
WebDesign Master 11 months ago
Да, пришлось сделать точное разделение, чтоб любой не переписывал базисные файлы под себя. Это естественно не длительно, однако избыточное пора ))
Сергей Протос 11 months ago
Спс. Только source-map по прежнему нету((. печалька
Сергей Протос 11 months ago
благодарочка) привет из Ялты!
Mischael Chicago 11 months ago
sourcemaps = require('gulp-sourcemaps'), gulp.task('sass', function() return gulp.src('app/sass/**/*.sass') .pipe(sourcemaps.init()) //там все стандартно .pipe(sourcemaps.write(линия где maps будет)) .pipe(gulp.dest('app/css')) .pipe(browsersync.reload( stream: true )) ); Попробуй, пытка не пытка
Сергей Протос 11 months ago
тривиальные вещи глаголишь). я полгода вспять паддинг от маржина не мог отличить). щас уже темы под вп верстаю. с галпом впринципе разобрался, уже использую. вот с соурс-картой затык. вроде порылся в гугле. в галпфайл добавил. работает, однако немного не этак будто нужно.
Mischael Chicago 11 months ago
Ну если нуб попросту галп изучи более детально и под себя затачивай, будто душе угодно. Отталкиваться необходимо от проекта.
Сергей Протос 11 months ago
за всем не уследишь). спс за гайды
Денис Башкиров 11 months ago
Молодец! Полезное дело делаешь!
Vasya 11 months ago
0:27 Поддержка SCSS 2:45 Верстки не видать в браузере. Тег <base> 3:30 Автоматическое открытие проекта в браузере командой gulp 4:15 Что такое tunel?
Mischael Chicago 11 months ago
Блин, видео - 5 минут))))
как-то так 11 months ago
Алексей, огромное благодарю за все ваши видео вы весьма помогаете новеньким разобраться в верстке и прочем, любопытно сколько вам лет? хотя бы +-5
WebDesign Master 11 months ago
31
World Webs 11 months ago
Спасибо Алексей! Как один желал задать проблема о том будто можно сделать синтаксис scss :)
Sergey Rosinskiy 11 months ago
о конечно! Спасибо! Очень полезное видео и сборка!
SharpeR 11 months ago
Спасибо, пользуюсь твоим собирателем, весьма комфортно!
Вадим Шорохов 11 months ago
эх, задумывался джедай вышел
Egor Grighorchuk 11 months ago
можно выяснить хотя бы примерную дату выхода джедая?)
Денис Шаповалов 11 months ago
конечно, джедая заждались все))
WebDesign Master 11 months ago
Это предварительные видео. Чтобы не говорить одно и то-же 1000 один, а попросту сделать ссылку.