Верстка сайта - нужны ли препроцессоры CSS

В этом видео мы обсудим верстку сайта и я расскажу нужны ли css препроцессоры сейчас для написания проектов по верстке. Верстка сайта для начинающих всегда дается непросто. Многие начинающие не понимают что нужно учить для того что б верстать сайты. Sass и Less препроцессоры призваны для того что б помочь разработчикам проще верстать сайты. Но нужны ли они сейчас когда нативный CSS имеет уже столько возможностей. Почему были созданы препроцессоры? Не было переменных. Не было вложенностей. Не было модульности. Плюс ко всему были проблемы с кросс браузерностью
Распродажа курсов по программированию: srs.myrusakov....

[@progi99]

о я заметил что видео уже три года, так мы может уже отказаться от препроцессоров?

[@Rozalinaag]

да, я не использую его. В css есть все необходимое, что раньше было в scss

[@АндрейКондратов-ф9ь]

​@@Rozalinaag Как решаете проблему ограничения использовать css переменных в media queries?

[@МистерХренасеуебаси]

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

[@SuprunAlexey]

Я сказал выучить и привыкнуть. Про модульность все сказал, вы невнимателен

[@igorabdukadirov4784]

Препроцессор легко, ленивость человека, затруднительность к применение постоянное и причем месяцами тратят время на это.

[@ThomasBlack452]

Это критически зависит от уровня предварительной подготовки человека. Неподготовленному человеку требуется больше времени. Ну тут в принципе просто надо понимать, как работает наш мозг. На пианино так-то тоже легко играть. Нажал на клавишу и звук пошёл. Только на деле обучение займет от 5 лет, в зависимости от конечной цели, конечно.

[@enterkvas]

Большое спасибо Вам, Михаил, за полезный контент. Актуальный для меня в настоящее время. Разочарование приходит в препроцессорах. Да и сборщики постоянно "капризничают", то какие-то плагины перестают поддерживаться, другие обновляются, но не ставят об этом в известность. То синтаксис меняется (хорошо, если еще поддерживается предыдущий). Постоянно нужно следить за этой темой. Куча времени. Думаю, да - для больших проектов - полезно (хотя здесь уже дело к фреймворкам js и библиотеке React). Вообщем, да, каждой задаче - свои инструменты. Здесь, конечно, я высказался о своей актуальной "боли". Успехов!

[@HORIZON_OF_GAMES_WORLDS]

Препроцессоры хотя бы ради вложенности стоит использовать. Я юзаю Koala (автоматический компилятор, автопрефиксер, сжатие css, source list, проверка ошибок), крайне удобная вещь. Особенно когда используется БЭМ. Пишу на SASS (SCSS синтаксис).

[@SuprunAlexey]

👍🏻👍🏻👍🏻

[@am35a]

ага, а когда начнешь работать с цветами в стулус будешь петь другую песню или с гридами в лесс :))))))))

[@progi99]

в чем вообще проблема посмотреть на препроцессоры и добавить их в функции в css? тем более что они и так это делают только семимильными шагами.

[@ThomasBlack452]

Семимильными шагами - это означает быстро. А тут, судя по всему, наоборот - мееееедленно. А так да. Выглядит так, что просто давно добавили бы это всё в css и не мучали бы людей. Но я не шарю, мб есть причины для недобавления, оно всегда не всё так просто)

[@ganjackal]

Спасибо а то я решил освоить верстку и столько инфы а тут еще и припроцессоры) Короче мозг взрывается)!

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

[@ganjackal]

@ спс

[@podpalmoi]

У меня аналогично получилось, но препроцессор это ещё легко учится. Ты посмотри урок по БЭМ)) вот там твой мозг встанет намертво. А ведь помимо БЭМ есть и другие методологии. Получается, что все эти методологии созданы не для комфортной и творческой работы верстальщика, а для реализации самолюбия конкретного заказчика, причисляющего себя к определённой "субкультуре" (методологии). Поскольку они не универсальны, то есть обладают помимо преимуществ и недостатками, тогда как у препроцессоров их мало и они специфичны.

[@steinye]

@@podpalmoi не соглашусь. Юзаю бэм и это комфорт в первую очередь для меня. Всё по полочкам, всё понятно

[@podpalmoi]

@@steinye Подскажи пожалуйста, как стилизуют окно загрузки файла на сервер? Я учусь у Фрилансера по життю, дошёл до DOMa, но на данный момент такой инфы от него нет.

Sass изучать максимум три дня, помогает, но не сильно, даже можно сказать почти особо не помогает, но рекомендую к изучению, говорю максимум три дня, это уже с практикой, а ознакомиться хватит и двух часов, легче чем таблица умножения. Хочу добавить, в css есть функция var, то есть я так понимаю уже тем более не нужен sass или less

[@yanmezinskiy8817]

Давай ещё раз , по второму кругу , расскажи ещё раз про JS

[@SuprunAlexey]

Что рассказать?

[@SuprunAlexey]

Про js сейчас не было ни слова

[@PalumbaRU]

Какая поверхность! Переливание воды 6 минут, и ничего полезного ни для новичков, ни для продвинутых! Уже давным давно никто не использует миксины для вендорных префиксов, для этого есть автопрефиксер! Остальное в чистом css может и есть, но браузеры это будут поддерживать ой как не скоро! Препроцессоры улучшают скорость разработки и прививают верстальщикам мышление программиста, что даёт возможность дальнейшего развития во фронтендера. А сколько проблем решает правильный синтаксис sass/stylus, что чистый css ещё долго не сможет, т.к. имеет избыточный синтаксис. Дизлайк, отписка от пустозвона

[@ThomasBlack452]

Дельные мысли.

[@zalik1999]

Будут ли обучвющие видео по angular? Ну и как в js курсах еще и практика.

[@elliewhite6745]

Ваш канал является основным для изучения вёрстки для меня. Спасибо!

[@alman_harbi]

Могу сказать вам, что variables можно задавать на чистом css. :root { -color-black: #000; } div { color: var(-color-black); }

[@peacefulquasar]

Ну такое себе

[@micoberss5579]

В препроцессорах удобнее ведь.

[@alman_harbi]

Я всего лишь сказал вариант, о котором вы точно не знали. Но, конечно, на препроцессорах удобнее работать.

[@iamInnoel]

@@alman_harbi с чего уверенность, что точно не знали?

[@awenn2015]

@@peacefulquasar нет, всегда удобно их использовать если одни и те же стили повторяются , потом можно через переменную поменять и не исправлять каждый селектор

[@nax1756]

актульно на 2023 год?

[@ThomasBlack452]

Я увидел в одной вакансии в 2024, что требуется знание SCSS (SASS), поэтому решил, что надо тоже зацепить эту тему. Похоже, что действительно большой надобности в препроцессорах нет для большинства задач, но благо учится эта тема не долго.

[@Петр-ч8л]

Те люди которые умеют правильно писать нативный js или css по умолчанию в выигрыше. А вы сами сказали что это фичи, ... которые в чем то может и помогаю, но создают ещё больше проблем совместимости. Если человек хочет научиться грамотно верстать или писать код, он должен прежде всего идти по нативной спецификации браузеров и владеть этим в совершенстве, а потом уже если появится желание усложнить себе и другим жизнь, пусть использует что хочет)

[@VIJana79]

я не пойму, как можно писать что-то на препроцессоре не зная основного языка. Один раз сталкивалась с молодым человеком, он мне сказал, что не знает css, поэтому всё пишет на scss

[@Петр-ч8л]

@@VIJana79 это даже не джуны, а так любители)

[@frenkixp9638]

а автор хотя бы что-то верстает, помимо лендингов на фрилансе? такое чувство, что человек просто 15 минут посидел, почитал в интернетике о препроцессорах и решил запилить видео. 1) в css скоро появится.. ну да, а ещё все завтра начнут верстать на гридах и тд. новые технологии конечно новые, но на практике будут использовать устоявшиеся технологии, пока не прекратят поддержку ie полностью (+ не забываем про сафари). 2) препроцессор = инструмент и, в принципе, почти каждая технология является инструментом. можно всё и ручками писать, но гораздо легче посидеть 2 дня, поучить, а потом ускорить свою работу в 2 раза минимум. 3) да даже на маленьком проекте можно использовать препроцессоры, это не настолько тяжёлая технология, чтобы от неё отказываться на 2-3 дня. при том, что компилировать ручками уже не надо, почти 2020 год на дворе, всё за тебя сделает ide видео всё хуже и хуже, этот канал - идеальный пример хреновой информации в интернете, которая не научит ничему полезному, отписываюсь, конечно

[@deusexmachina9999]

Не вижу никакой полезности в этих костылях.

[@AlexAlex-sh3mz]

Мне кажется из за того, что у тебя видосы поверхностные, аудитория не растет. Чисто залётные подписываются. Но да ладно, дело хозяйское.

[@Tornado-ln7fq]

Какой прорыв,в не куда,скажу кратко,нахер они не нужны.Это корявые понты ,которое только усугубляет дело,нежели помогает.Сейчас они тем более ,не нужны,на данный момент все решает css их коробки))

[@jokerovich]

Мне кажется, что пора отписываться...

[@SuprunAlexey]

Че

[@rydzyks]

видео , ради рекламы , пре-процессоры учатся очень быстро темболее это практика ,"Никто не пишет на Less" фреймворк magento использует less , очередной пример не компетенции автора , а то что пре-процессоры не нужны это полный бред....

[@SuprunAlexey]

Все быстро привыкают к препроцессорам? Не согласен. Про никто не пишет на Less я не говорил, не знаю что вы себе надумали. Sass и Less это дело вкуса и привычки, они практически идентичны. И в конце я не говорил что они совсем не нужны. Вы не досматриваете видео, и что то пишите, досмотрели бы....

[@rydzyks]

@@SuprunAlexey "Никто не пишет на Less" - это был ваш ответ на комментарий, который вы уже удалил , а раз вы так поступаете не вижу смысла в них....

[@SuprunAlexey]

Как хотите

[@yaroslavbaranovsky4382]

Там нету что учить, просто береш и используешь. Другой вопрос, так ли они необходимы. Я не раз пытался работать с ними, да есть некоторые преимущества, но если это не крупный сервис или интернет магазин то особо ничего они не ускорят. Более того почти всегда на этапе тестирования сайта уже на хостинге многое дорабатывается, улучшается. И тогда уже не удобно их использовать, быстрее без них дописать.

[@SuprunAlexey]

Есть проекты, где без препроцессоров очень тяжко

[@erhanblock1965]

Only water

[@OnThe100]

Скажем так. Если хорошо знаешь CSS и базово jQuery (или альтернативу) примущества SASS неочевидны. Если не знаешь как разбить стили на файлы, не умеешь организовывать классы на фронте своей любимой ЦМС-ки - никакие препроцессоры тебя не спасут. К созажленью зарплаты в ИТ высокие не там где сделать легче, а там где разработка проекта обросла костылями, вот и требуется набор технологий для джуна, как на уровень доктора наук.

[@ИванАукин]

Если хорошо знаешь css, то идея использовать препроцессоры сама по себе возникнет. Как минимум ради ускорения разработки, получая тот же css файл на выход

[@nookebbx4532]

а если я использую css только в одном файле html?

[@SuprunAlexey]

Тогда не нужен

[@chikosan3890]

спс

[@braivs]

Почему ничего не сказано про html препроцессоры, например pug?

[@SuprunAlexey]

Потому что говорили про препроцессоры css

[@braivs]

@@SuprunAlexey А когда про html препроцессоры будет видео?

[@SuprunAlexey]

А надо?

[@braivs]

@@SuprunAlexey да! Это сильно ускоряет вёрстку.

[@khanuralgo4329]

@@braivs jade топ

[@trustyvic]

Сахар нужен. Просто если простой лендос - можно и так замутить. Если сложный проект - нужно пользоваться.....

[@SuprunAlexey]

Примерно так и есть

[@am35a]

гон! собирал маркетплейсы на чистом css ибо лесы, сасы, стулусы это сущий гемор, сколько косяков за ними не счесть, один + миксины и те если будут работать, а стайлус вообще ад...

[@SuprunAlexey]

Кому как удобнее и быстрее

[@am35a]

@@SuprunAlexey Ниже пример показывает какзаканчивается удобство например стулуса и не начавшись :-D :root --second-color rgb(52, 58, 64) .button-light color lighten(var(--second-color), 20%)

[@artemartemov7331]

В первый раз слышу о препроцессорах

[@SuprunAlexey]

Все ещё впереди

[@Vladikslavik]

Ещё бы от Бабеля отказаться было бы неплохо. Достал уже этот велосипед для велосипеда ))

[@rebus1985]

Блин, там учить то нечего особо

[@SuprunAlexey]

Привыкнуть

[@rebus1985]

Web Developer Blog спасибо за видосы!

[@АлександрСамарин-ь7к]

скрытая реклама, и заученные скороговорки, от себя ничего нового, пора отписаться от тебя братан

[@SuprunAlexey]

Где заученные скороговорки? 😂😂 ты шо

[@Lyaskimasyaskin]

Препроцессоры препроцессировали, препроцессировали, да не выпрепроцессировали.

[@SuprunAlexey]

Именно так

[@millenial1584]

@@Lyaskimasyaskin Мне ютуб предлагает этот коммент перевести на русский)

[@Zfx12]

Привет я новый программист

[@SuprunAlexey]

Добро пожаловать

[@HORIZON_OF_GAMES_WORLDS]

Что программист делает в видео для верстальщиков?

[@SuprunAlexey]

Препроцессоры это то ещё программирование

[@igorabdukadirov4784]

Учите лучше с нуля JS, CSS, HTML!!!!

[@sevi43]

Сложно привыкнуть к препроцессорам?) серьёзно?)

[@SuprunAlexey]

Некоторым да, почитай комментарии

[@ivansmorzhaniuk690]

Клас

[@SuprunAlexey]

Ага