TailwindCSS. Полный курс

#YauhenK #webdev #TailwindCSS #Tailwind #CSS
В данном видеокурсе мы с вами рассмотрим TailwindCSS. TailwindCSS - это CSS-фреймворк, предлагающий обширный каталог классов и инструментов для облегчения стилизации сайта или приложения. Вместо традиционного использования одного класса, содержащего набор свойств (компонент), он предоставляет класс, которому соответсвует одно свойство. Tailwind использует набор интуитивно понятных классов, префиксов и суффиксов, которые очень просты для чтения и понимания. По результату курса мы создадим статичную страницу новостного сайта с множеством элементов по типу брэдкрамбы, бейджики, списки тем, пагинации и т.д. Сама же страница будет разработана с использованием подхода mobile first и будет поддерживать тёмную тему.
✒ Репозиторий курса:
✔ GitHub: github.com/YauhenKavalchuk/ta...
✒ Timeline:
✔ 0:00 - Введение (Introduction)
✔ 2:05 - Установка окружения (Setup Environment)
✔ 10:11 - Шрифты и цвета (Fonts & Colors)
✔ 17:35 - Отступы и граница (Padding, Margin & Borders)
✔ 27:03 - Декорирование (Hover & Decoration)
✔ 35:15 - Кнопки (Buttons)
✔ 43:06 - Применение Flexbox (Using Flexbox)
✔ 48:39 - Директивы (Directives)
✔ 55:16 - Иконки (Icons)
✔ 59:43 - Сеточный макет (Grid Layout)
✔ 01:08:43 - Градиенты (Gradients)
✔ 01:16:07 - Отзывчивый макет (Responsive Layout)
✔ 01:24:39 - Картинки (Images)
✔ 01:31:29 - Плавные переходы (Transitions)
✔ 01:38:24 - Тёмная тема (Dark Theme)
✔ 01:47:53 - Пользовательские настройки (Customization)
✒ Полный список готовых и планируемых курсов:
✔ Trello: trello.com/b/R6rD7qq8
✒ Автор курса:
✔ KZbin: / yauhenkavalchuk
✔ Instagram: / yauhenkavalchuk
✔ Twitter: / yauhenkavalchuk
✔ VK: YauhenKavalchuk
✔ LinkedIn: / yauhenkavalchuk
✔ GitHub: github.com/YauhenKavalchuk
✔ VK (Группа): webdevcom
✒ Поддержать развитие канала: github.com/YauhenKavalchuk/yo...

[@igorkulibaba7287]

Очень очень искренне благодарен ,за такую афигенскую работу!

[@YauhenKavalchuk]

Спасибо большое за отзыв

[@ta_ivanova]

Большущее спасибо за подробный разбор фреймворка!

[@YauhenKavalchuk]

Пожалуйста

[@zaurhuseynzade6950]

Несправедливо малое количество лайков для столь качественного объяснения.

[@YauhenKavalchuk]

Благодарю

[@ser9ga592]

Великолепно! Очень доступно и без воды

[@YauhenKavalchuk]

Спасибо большое за отзыв

[@RajPolinovsky]

Спасибо вам за полный курс!

[@YauhenKavalchuk]

Пожалуйста

[@yaroslavsolomianyi2091]

Спасибо за прекрасный видеоролик.

[@YauhenKavalchuk]

Спасибо за поддержку

[@znakjj]

Спасибо большое за такую работу!

[@YauhenKavalchuk]

Всегда пожалуйста

[@Grigoren_com]

шикарная подача материала! спасибо большое за Ваш труд!

[@YauhenKavalchuk]

Спасибо за отзыв

[@antonkuznetsov2680]

Это лучший курс что я видел!!! браво! просто браво стоя!

[@YauhenKavalchuk]

Спасибо большое за отзыв

[@medokuk8644]

Благодарен за урок, четко все объясняешь спасибо!

[@YauhenKavalchuk]

Пожалуйста

[@andrew_b2r]

Женя большое спасибо, ещё не начинал смотреть но уверен что контент будет годный как всегда)

[@YauhenKavalchuk]

Благодарю

[@user-wx4eg7sf3c]

Спасибо большое за труд 👍

[@YauhenKavalchuk]

спасибо за отзыв

[@alexsavchenko1590]

Спасибо за труд, жаль что мало просмотров, в рунете твой курс лучшее что удалось найти!👍

[@YauhenKavalchuk]

Спасибо за отзыв

[@user-hr9es8ee8f]

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

[@YauhenKavalchuk]

Спасибо большое за отзыв

[@yerkebulanberdissugirov6311]

@@YauhenKavalchuk Здравствуйте, у меня на yarn add -D tailwindcss postcss - выдает ошибку, как это исправить?

[@artemenko53]

@@yerkebulanberdissugirov6311 Надо установить yarn коммандой npm install --global yarn

[@alexmoney4641]

Отличное видео, огромное спасибо за труд!

[@YauhenKavalchuk]

спасибо за отзыв

[@user-bf1gd4oh4m]

Очень все структурировано и подробно! Велике дякую!)

[@YauhenKavalchuk]

Всегда пожалуйста

[@raftti]

Спасибо за видео, все понятно и информация нужная

[@YauhenKavalchuk]

Пожалуйста

[@Nikitosss91]

Лайк не глядя, Женя - это гарантия годноты!

[@YauhenKavalchuk]

Спасибо)

[@adamandsteve13]

Отличный урок. Красота :-) И приятный голос.

[@YauhenKavalchuk]

Спасибо)

[@user-eb6yb7ck6v]

большое спасибо. очень хороший материал

[@YauhenKavalchuk]

Пожалуйста

[@artemivanov5013]

Спасибо за урок!

[@YauhenKavalchuk]

Пожалуйста

[@ganjour]

Спасибо. Хороший, нужный курс.

[@YauhenKavalchuk]

Всегда пожалуйста

[@slt4415]

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

[@YauhenKavalchuk]

👍

[@alexandr8151]

Спасибо за курс)

[@YauhenKavalchuk]

Пожалуйста

[@beegoodb1213]

Спасибо за труд!

[@YauhenKavalchuk]

Пожалуйста

[@user-fy1wv1gj6n]

хороший гайд. спасибо за обучающий контент

[@YauhenKavalchuk]

Спасибо за отзыв

[@pavelillich7612]

Спасибо! Это было здорово!

[@YauhenKavalchuk]

Пожалуйста

[@samolevich]

Очень хорошо, спасибо

[@YauhenKavalchuk]

Всегда пожалуйста

[@Oksan4ik1]

Огромное спасибо) знакома с технологий, решила обновить знания и очень много вынесла с вашего урока!)

[@YauhenKavalchuk]

Пожалуйста

[@user-lx5vv3uu8u]

Благодарю! Заранее ставлю лайк, но смотреть буду позже, как освою базу!)

[@YauhenKavalchuk]

Пожалуйста

[@Signtone]

Ооо люблю полные курсы))

[@YauhenKavalchuk]

👍

[@user-kf9ff3no2t]

Очень классно всё расписано

[@YauhenKavalchuk]

Спасибо

[@tatianovnafrutti8982]

Супер ! Спасибо!!!!

[@YauhenKavalchuk]

Пожалуйста

[@frankshepherd5953]

Курс просто пушка!

[@YauhenKavalchuk]

Спасибо

[@piskaorangutanga]

Благодарю! Интересный фреймворк. Было бы неплохо увидеть подобный курс об SCSS.

[@YauhenKavalchuk]

Возможно в будущем

[@MrLgbk]

Согласен с крутостью подачи маериала. Спасибо!

[@YauhenKavalchuk]

Пожалуйста

[@rudakov_ilya]

Лайк не глядя😍

[@YauhenKavalchuk]

Благодарю

[@andranikhambardzumyan6264]

Великолепно!

[@YauhenKavalchuk]

Спасибо за отзыв

[@mrSeven-iu2ii]

Не понимаю почему так мало лайков, отличная работа!

[@YauhenKavalchuk]

Понятия не имею

[@user-pw9zk4hn1q]

Честно это талант, все бы такие подробные видео

[@YauhenKavalchuk]

Спасибо

[@user-yl6mi9sq4q]

Топ! Изучил фреймворк за 2 дня. Всем советую

[@YauhenKavalchuk]

Спасибо за отзыв

[@user-es2vr3cv1v]

Бро, поздравляю тебя с 100к. Смотрю твой канал уже 4 года, вспоминаю первые видео по js, ты уже наверно super senior спустя столько лет

[@HitLowww]

Очень крутой курс! Несправедливо малое количество просмотров и лайков. У Вас талант.

[@YauhenKavalchuk]

Спасибо большое за поддержку

[@mixfix86]

спасибо!

[@YauhenKavalchuk]

Пожалуйста

[@user-zs5iw1tw3w]

Очень крутой контент

[@YauhenKavalchuk]

Спасибо

[@user-oz6xm9zp9d]

когда круто, тогда круто. Лайк подписка

[@YauhenKavalchuk]

👍

[@user-rs4hf7ud2e]

Спасибо

[@YauhenKavalchuk]

Пожалуйста

[@tazorprod.934]

Tailwind в связке с реактом просто пушка

[@YauhenKavalchuk]

👍

[@alexeycherkasov1144]

Чтобы не использовать сайт Lorem Ipsum можно юзать встроенную возможность Emmet: например, lorem10 выведет текст-рыбу из 10 слов

[@YauhenKavalchuk]

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

[@facts_from_scratch]

или lorem*3

[@user-zu3ld8is4y]

благодарю

[@YauhenKavalchuk]

Всегда пожалуйста

[@FelAA]

Спасибо за видео. На мой взгляд стоило рассказать про изменения дочерних элементов, например, когда меняется стиль вложенных элементов при наведении мыши на родителя

[@YauhenKavalchuk]

Пожалуйста

[@chkpg4317]

спасибо

[@YauhenKavalchuk]

Всегда пожалуйста

[@uzver3787]

Хороший курс. Спасибо! Единственное пожелание, немножко подкрутить звук, чтобы меньше низов было, гула.

[@YauhenKavalchuk]

Пожалуйста

[@xcvb4]

Спасибо за подгон , как раз начал учить tailwind.

[@NeGovoriNet]

сочувствую

[@xcvb4]

@@NeGovoriNet что такое?

[@YauhenKavalchuk]

Пожалуйста

[@arinqwerty]

Спасибо за курс! Очень наглядно и понятно.💙 Но я не понимаю ЗАЧЕМ? ПОЧЕМУ люди это используют? На CSS коде килобайты экономят? Больше плюсов не вижу! Ещё понимаю для мелких пет-проектов и админок - ок, время сэкономить. Но ведь это кошмар, мне отвратно от кол-ва классов на элементе! Увидеть ЭТО на проекте нормального размера, с нестандартным дизайном, лично мне, больно! БОЛЬНО глазам! Что заставляет людей выбирать это!? Особенно в пару с реактом, при возможностях компонентного подхода и изоляции стилей. Объясните мне: зачем вы это делаете? Как мне теперь с этим жить!? Как мне жить с проектом на tailwind!? Как смириться с этой болью и раздражением? Мне мало того, что читать, мне писать эти простыни классов придётся! 😭Я обожаю вёрстку и задачи по ней, но с tailwind я буду всеми правдами и неправдами от них отнекиваться. P.S. Страшно! Очень страшно!

[@YauhenKavalchuk]

Спасибо за отзыв. Касаемо вашего комментария - отчасти согласен

[@user-lz4ob7gj4p]

Только начал смотреть, как обычно ВСЁ СУПЕР! СПАСИБО! Можно в двух словах - чем Тайлвинд лучше/круче Бустрапа?

[@YauhenKavalchuk]

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

[@SerhiiNesterov]

Спасибо ❤

[@YauhenKavalchuk]

Пожалуйста

[@artem_ib]

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

[@YauhenKavalchuk]

👍

[@drino955jug3]

тем временем сейчас tailwind в самом разагре хайпаахапхахп

[@artem_ib]

@@drino955jug3 ну хайпует) в целом мнение не поменял, бесят когда много классов, с другой стороны это наименьшая проблема с которой я сталкиваюсь))

[@gfhitdxaahn]

@@drino955jug3 пока нет, это еще не предел

[@user-rk7dm1xm3r]

Просто лучше никто бы и не снял. После Tailwind обычный css - слишком правильный и консервативный, это как говорить "Здравствуйте уважаемые господа", когда Tailwind предлагает говорить просто - "Всем привет". Супер. Спасибо))

[@YauhenKavalchuk]

Всегда пожалуйста

[@Vladimir-yh2dl]

урок классный, спасибо большое ! было бы здорово ещё узнать как удалить не использованные стили

[@YauhenKavalchuk]

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

[@Leon-rv2zm]

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

[@YauhenKavalchuk]

Можно увеличить скорость

[@almichael34]

Если повторять код за ведущим, то скорость вполне нормальная, иногда даже не успеваю, приходится перематывать )

[@aleksandrkobelev8868]

Если у кого как и у меня не работает yarn то нужно его установить npm install -g yarn, а затем запустить VS code от имени администратора и запустить такое Set-ExecutionPolicy RemoteSigned

[@YauhenKavalchuk]

Что-то как-то сложно. Никогда ничего подобного не делал. Обычно достаточно просто скачать yarn, или просто использовать npm

[@BIS84oxen]

@@YauhenKavalchuk Это потому, что у Вас не винда ))

[@Ianarkhipov]

а можно просто не использовать yarn а обойтись npm. У меня с установленным yarn была потом проблема с angular-приложением, в котором даже yarn не был задействован, пришлось лезть в корень машины и копаться в скрытых файлах

[@pdidevich]

Ощущение, что они переизобрели атрибут style, настолько атомарные классы используются. А потом придумали директивы, чтоб получились обычные классы ) За видео спасибо - помогло быстро понять, в чем суть фреймворка.

[@YauhenKavalchuk]

Пожалуйста

[@alikhanzakonov5575]

Просто мои мысли прочитал, брат)

[@TheTurbobarbitura]

Если бы ещё разобрал настройку stylelint для tailwind, было бы сверх шикарно=)

[@YauhenKavalchuk]

🤷‍♂️

[@user-fg9ps9tk6i]

Здравствуйте! У Вас начиная с ветки lesson_10 в секции banners остался лишний класс (bg-gradient-to-tr), который Вы забыли удалить: . На отображение, конечно, не влияет.

[@YauhenKavalchuk]

Спасибо за отзыв. Ну забыл и забыл) главное ничего не ломается)

[@user-fg9ps9tk6i]

@@YauhenKavalchuk всегда пожалуйста, вернусь из деревни, где нет интернета, ещё отзывов напишу :)

[@romanmr5719]

большое спасибо за данный курс, очень помогло) я бы хотел уточнить, это нормально, что у меня, когда появился styles.css и main.css они были сразу в postcss, а у тебя они в css. мне менять надо на css, или нет?

[@YauhenKavalchuk]

Можно не менять

[@adeven2226]

вопрос зачем оборачивать div внутрь другого div'а? например когда создавался footer сайта 25:49

[@YauhenKavalchuk]

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

[@promoabys]

Евгений, приветствую Хотел бы услышать вашу оценку по рациональности использования тейлвинда в работе? Добавлю как использую его я. Я его использую как способ быстрой кастомизации композиционных компонент, сохраняя там и основной класс. Не использую тейлвинд в базовых презентационных компонентах, чтобы не плодить лишних зависимостей. Для больших проектов подходит не очень, а для того чтобы сверстать пару страничек вполне. Спасибо за такой большой обзорный ролик

[@diatm1506]

Как в нём анимации делать и ховеры?)))

[@promoabys]

@@diatm1506 ховеры есть и анимация какая-то тоже. Не сверх слохсложная, но что-то можно.

[@dobramorda9818]

@@diatm1506 можно через бэм уникальные классы давать, заливать основной функционал через tailwind @apply и после писать css свойства. И кастомизация будет и обобщенность стилистики по проекту. Было бы круто ещё использовать как если бы это был какой то sass, то бишь делать некий extend класса общего для ряда элементов.

[@user-pm3ms3kd9h]

спасибо за хорошую подачу.! Так и не смог найти причину почему на 'randomuser' фотках не применяются класс на скругление на размер, фотки и с папки вставлял ни в какую не хочет применяется тоже .

[@YauhenKavalchuk]

Пожалуйста

[@user-kt7fm6ow4p]

Спасибо за ролик, все понятно изложено. По-моему мнению, Tailwind - полная лабуда, не понимаю, почему популярен

[@YauhenKavalchuk]

😁🤷‍♂️

[@sharpsss7666]

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

[@YauhenKavalchuk]

Подумаю….

[@ilyamishutka6731]

Такой вопрос, а не могли бы вы сделать курс по gulp или webpack ? Ну или отдельное видео?

[@YauhenKavalchuk]

Возможно в этом году сделаю…

[@ilyamishutka6731]

@@YauhenKavalchuk я буду вам очень благодарен)

[@webmechanic-kz]

Да оно конечно хорошо но какой вес будет иметь CSS после компиляций и насколько оно удобно если делаешь вёрстку по шаблону?

[@YauhenKavalchuk]

Вес минимальный. Что касается вёрстки - шаблон должен быть сделан с учётом специфики tailwind. В противном случае придётся потратить время на создание кастомного конфигурационного файла

[@nagorny19]

Следующее видео: "Prettier. Полный курс" ;)

[@YauhenKavalchuk]

Маловероятно

[@kirillpavlovskii8342]

почему то при подсказке класса нету справа информации как например где text-3xl и справа инфо сколько это в rem и в px

[@YauhenKavalchuk]

🤔🤷‍♂️

[@a.riwall]

если что lorem можно генерировать в vs code просто пишешь Lorem10 (10 это число слов)

[@YauhenKavalchuk]

Спасибо за уточнение

[@jet4904]

Лучший чел,желаю тебе всего наилучшего

[@YauhenKavalchuk]

Спасибо

[@KomanDante999]

товарищи, у кого-то возникала проблема с плагином Tailwind и lifeserver? пока запущен lifeserver - подсказки не работают. Как только выключаешь - норм все работает

[@YauhenKavalchuk]

🤔🤷‍♂️

[@KomanDante999]

@@YauhenKavalchuk А, нашел в чем прикол, Live Server ни при чем. Когда создаю атрибут class курсор автоматически помещается внутрь "|" и подсказки не выводятся. Если щелкнуть в другое место а потом опять вернуться в class, то подсказки начинают работать. Странное явление, может с эммитом конфликтует? Я все плагины повырубал лишние, но вот такой глюк.

[@user-un7pe4mn1l]

Подскажите, почему не работает ни один цвет бордера? li>Home

[@user-un7pe4mn1l]

Многих цветов просто нет в public/style.css

[@user-un7pe4mn1l]

не могу найти команду подключения доп стилей в style.css Подскажите какэ то сделать) ведь в будущем на проектах нужны будете не только стили, предлагаемые в стандартном импорте tailwind

[@user-pw9zk4hn1q]

Евгений помогите пожалуйста, Как извлечь все классы и свойства сетки grid из Tailwind CSS для использования в своем собственном файле стилей?

[@YauhenKavalchuk]

Если честно не знаю( не пробовал такое

[@dimasnytin]

Добрый день! У меня проблема, делаю проект для портфолио и для css использую данный фреймворк, проект на React. И что интересно падает с ошибкой которая указывает на @tailwind base. Подскажите пожалуйста, что это может быть?

[@YauhenKavalchuk]

Не видя код и ошибку, маловероятно что чем-то смогу помочь

[@simpsomk]

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

[@YauhenKavalchuk]

Ссылка - потому что каждый блок кликабельный и потенциально ведёт на статью. А картинка в виде тэга, что бы показать как tailwind обрабатывает такие случае. Да и вообще предполагается, что подобный шаблон будет изменяться через CMS. И если путь до картинки в html тэге через админку поменять - не проблема, то как вы измените картинку (через админку) которая определена в CSS

[@simpsomk]

@@YauhenKavalchuk спасибо за ответ!)

[@inilim]

tailwind не может самостоятельно сгенерировать apply для всех классов и подставить после сборки?

[@YauhenKavalchuk]

Неа

[@firewatermoonsun]

Странно, скачал второй урок из Гитхаба, установил зависимости, и запустил с liveserver - tailwind стили не отражаются. Похоже tailwind не распознает. Что это может быть?

[@YauhenKavalchuk]

Вижу по следующим комментариям - запустилось

[@user-ih9ir5ir2x]

За разбор спасибо! Но html со всеми этими классами просто уродливый. Не понимаю, почему css писать сложнее или...? Стилей на простую кнопку может быть уйма. Естественное желание спрятать это все в отдельный файл. А стилизация по бэм?

[@YauhenKavalchuk]

Спасибо за отзыв)

[@user-vo7sm5sz7p]

Это и есть эталон уродства. Мы в компании когда-то давно наступили в таилвинд, до сих пор отмыться не можем. Преимуществ у него минимум, но при этом он тянет огромный файл со стилями в проект и превращает хтмл в нечитаемое нечто

[@knowledgedose1956]

​@@user-vo7sm5sz7ptailwind, по крайней мере новый, не добавляет всю библиотеку в бандл, а только то, что используется в проекте. Насчёт пачек классов, да, это очевидный минус, но можно выносить часто переиспользуемые классы и тд.

[@user-sp8ty2ol8m]

У меня не работаю директивы чтобы я не делал :( решение с GitHub не помогло , сначала показывалось , что директива неизвестна , я вроде пофиксил эту проблему , но даже когда она не отображается ничего не работает...

[@YauhenKavalchuk]

🤔 не видя кода трудно что-то подсказать

[@maksimych98]

Что за тема в visual studio code на видео? Буду благодарен, если ответите

[@YauhenKavalchuk]

Material Gecko

[@maksimych98]

@@YauhenKavalchuk Спасибо огромное. Удачи)

[@user-bk6xu3ue3q]

есть что нибудь про tailwind-merge и clsx?

[@YauhenKavalchuk]

Нет

[@jekapan481]

Почему, когда я пишу стили связанные с цветом, то у меня не появляется рядом квадратик показующий 😊цвет? Раньше был, а сейчас пропал

[@YauhenKavalchuk]

Если раньше было, а теперь нету, то вообще понятия не имею, попробуйте переустановить плагин

[@MrDimichZ]

Насколько вообще оправдано применение этих CSS фреймворков? Слышал что многие профессиональные верстальщики их не любят

[@muratkudainetov4415]

к 36 минуте содержание html страницы зацвела зеленью из классов. Прямо вижу, как горит одно место у фронта на таком проекте. Прикиньте, когда вместо того, чтобы работать с компонентами, он сидит и ищет нужное место среди этих 100500 классов. А если это еще jsx, охохохо. Спасибо, я дальше на sass посижу. Tailwind похоже очередной хайп на годик

[@stormbraker637]

Ага уже 3 года как годик, и заказчики все больше внимания обращают

[@MSiL_UA]

52:34 , объясните пожалуйста каким образом в секунду заменяются все повторяющиеся стили

[@YauhenKavalchuk]

postcss обрабатывает это

[@MSiL_UA]

@@YauhenKavalchuk спасибо за ответ и урок!)

[@synglrty]

Подскажите как исправить ошибки, в webstorm показано много ошибок и варнингов в styles.css файле

[@YauhenKavalchuk]

В одном из видео упомянул это, нужно дополнительно доустановить плагин, этотлегко гуглится

[@synglrty]

@@YauhenKavalchuk гуглил, все равно не могу исправить, есть подсказка стилей но сами стили не применяются, ну ладно разберусь как-нибудь я надеюсь

[@user-jc7qz6oy2q]

В доках написано наоборот, apply использовать для мелких вещей.

[@YauhenKavalchuk]

🤔

[@user-kt7fm6ow4p]

49:51 смеюсь, тайлвинд изобрел обычные классы. "Мы почистили полотно классов"😂

[@YauhenKavalchuk]

😁

[@simpsomk]

Для чего устанавливали postcss?

[@YauhenKavalchuk]

Если я не ошибаюсь, на момент записи по другому не работало, выкидывало ошибку что нужен postcss

[@frankshepherd5953]

Вконтакте нельзя перемещаться с помощью TAB, в яндексе сразу видно что болт забили) через раз)

[@YauhenKavalchuk]

Получается…(

[@user-hruser]

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

[@YauhenKavalchuk]

На самом деле - это очень даже не плохо, т.к. простая инверсия не всегда работает хорошо

[@2Extremum]

- А давайте css использовать в разметке? - Ну это некрасиво, так не надо делать. - А мы его назовем Тайлвинд и сделаем типа классами, с вагоном названий к каждому элементу......

[@YauhenKavalchuk]

Ну это одна из методологий - AtomicCSS, имеет право на жизнь

[@2Extremum]

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

[@user-cv9xy4uu2f]

И как потом такой код читать другому разрабу? это же неудобно в командной разработке. Загуглите минусы данного фреймворка, их слишком много чтобы его использовать. Как по мне лучше стать мастером в scss чтобы не писать код который в дальнейшем тяжело будет поддерживать.

[@YauhenKavalchuk]

Да, есть такой нюанс

[@digitalturkistan1857]

@@YauhenKavalchuk мне кажется именно это фреймворк станет стандартом . лично моё мнение

[@Maksim-nu8hb]

А React не сложно читать?

[@PacoOfficial]

Я вообще в шоке почему это стало популярным, когда все топили за чистоту html и понятные короткие классы

[@iosswiftuipractice3793]

@@Maksim-nu8hbсмотря какая архитектура в приложение. Если чистая то все понятно и плюс документацию оставлять.