Мені з першого разу нагадує Bootstrap ане inlineStyle, дякую за відео як раз дивлюсь + лайк, поставив на меті собі вивчати Tailwind CSS бо щось дуще велику популярність набрав)
tailwind це найкраще що сталось з css з розробниками. це робить підтримку просто неймовірно легкою... це відчується через років 10 на проєкті де відповідально ставились до стилів і через 2 роки на проєкті де клали на стилі. всі стилі локалізовані до елементу - чи не казка це? не треба думати чого той довбаний блок трохи пливе
накидав собі кілька класів по перших буквах css властивостей і горя не знаю 😅 тим паче 90% використання це щось типу class="d-f jc-sb g-15" що аналогічно "display:flex; justify-content:space-between;gap:15px"
Я придбав за 150$ набір компонентів Application UI у TailWind для своєї Angular бібліотеки і не нарадуюсь. 150$ - це ж ціна лише 3-5 днів роботи розробника. Самому таке не написати
@@stormbraker637 дякую, та трохи не те. Наприклад при дебагінгу буває складно зорієнтуватись, де в коді той чи інший блок. При використанні БЕМ, це легко за рахунок кастомних класів.
@@stormbraker637 так, але інколи трапляються ситуації, що в 1му файлі може бути кілька компонентів. Наприклад картка товару, котра має опис, шапку, якісь додаткові данні. І знайти саме потрібний блок коду безпосередньо в розмітці стає складніше. Наприклад через дев тулс його відтетектити, та в коді складно знайти. Особливо якщо писав інший розробник. Я гуглив і як рішення пропонують давати в розмітці класи по БЕМ, але ж тейлвінд для того щоб від них відмовитись. Також є варіант писати HTML коментарі, але тут проблема що вони не мають потрапляти в прод, тому потрібно ще писати плагін котрий їх прибиратиме. Цікаво може є ще якісь практичні рішення)
Поки що нема. А він потрібен? Ніхто і ніде його не визнає зараз. Це лише для підняття власної самооцінки. Я зроблю сертифікати коли курс буде готовий повністю.
Я про більшість сертифікатів, і свої в тому числі. Сертифікат має цінність якщо його видає організація або людина яку всі знають і поважають. Мене знає мало, нажаль.
@@IhorVyshniakov на одному вебінарі рекрутер сказала що вони відсіюють резюме одної великої айті школи, тобто просто не беруть того в кого вказаний її сертифікат (підозрюю що це GoIT, так як тоді розглядались CV для прикладу, і якраз в чувака був фулстак гоайті курс) Зрозуміло що це в одній канторі так, але заставляє задуматись, так як айті школи дійсно клепають не завжди достойних розробників
Для того, щоб не витрачати час на написання унікальних класів там, де це не потрібно. Бо 50%+ часу роботи з умовним бем це дрочиво із серії "вигадай унікальний клас для схожого на попередній блок щоб написати {display: flex; flex-direction: row; gap: 12px}" щоб зробити ряд для секції з двух дочірніх елементів. А в tailwind це ="flex gap-3" Коли це лендос - ще можна викрутитись тільки з бем, а коли величезна якась адмінка - вже проблема. Умовну складну карточку товару дійсно простіше робити з умовним бем і стилізувани з css, як і всі інші елементи у яких більше 1 або 2 візуальних станів. Але ж коли ти будуєш інтерфейс - все зводиться до "в ряд" або "в колонку". Найзручніше - комбінувати. Складне - css, просте - tailwind css.
@@Oleksii-t7c ага, тобто краще витрачати час на налаштування цього лайна, ніж робити так, як нормальны люди ? ))) а чому б просто тоді не писати звичайні інлайн стилі ? може треба згалати чому інлайн стилі це не гуд ? Назви класів дратує ? - а шо не так з модулями CSS ? Ні-ні-ні. Для маленьких проектів чи своїх проектів - ок, швидче писати стилі. Але для великіх проектів, котрі умовно завтра стануть легасі, писати на всяких бутсрапах чи тайлвіндах - егоізм. Це аж ні як іншим розробникам не допоможе працювати з цим проектом. Той ж Гугл розробляє свої проекти як можна простіше, хоча може дозволити робити все дуже складно, бо там працюють круті інженери. Але ж таки пишуть просто і ясно. Одже - витрачати час на настройку тайлвінд, чи витрачати той же час на роботу наприклад з SCSS. Але ж з SCSS після мене сможе працювати любий джун. А з інлайном тайлвінда у дві строки й сеньору буде не зручно. Вибір ???
PurgeCSS, то скоріше для старих версій, коли за замовчуванням збирався повний бандл, а тобі потім треба було вручну запускати очищення. А так дуже корисна штука, я його додав до свого gulp-конфіга, й і з Bootstrap використовую, і коли треба почистити стилі над якими до мене працювало кілька розробників і зараз там чорт ногу зламає. А для самого Tailwind головне запам’ятати що 4 це 16px, і розміри та відстані розраховуються кратно цьому :)
Звісно можна. Я працював що з тим що з іншим, то тейлвінд простіше. Ще забув згадати у відео що з Tailwind нема проблем при серверному рендерингу. CSS in JS має певні обмеження.
Css-in-js - дуже повільний, як на мене. Зараз взагалі тенденція така, що все, можна зробити через css, має бути зроблено через css. Tailwind - дуже класний інструмент в плані набору утіліт для лейаутів. Все інше можна писати звичайним css. Якщо у вас макет, наприклад, зроблений за якоюсь систему відступив, то завдяки TW у вас грубо кажучи буде тільки 3 класи, типу mb-4, mb-8, mb-12 і все одно скільки у вас компонентів. А ось якщо це писати в кожному компонентів звичайним css, та ще й через module.css, то порахуйте, як роздується бандл. Так, можна просто самому створити ці утілітарні класи, але ж їх потім складно підтримувати. Тому кодогенерація - це добре)
З власного досвіду, TW - просто іграшка. Можливо для React це ще ок, я пишу на Vue, і там це не дає майже нічого. До того ж, можна просто освоїти пару PostCSS інструментів, і результат буде ще краще. Він точно не для всіх проектів, але його пхають всюди, і просувають з кожного "вікна".
динамічні класи - є сейф ліст - який буде створювати потрібні класи переваги - якщо шариш тайлвінд - легко писати - розробка недоліки - вхідний поріг, складніше парсити-дебажити - підтримка
Дуже не хотів його вчити і казав що буду тільки на проекті на ходу розбиратися. Але потім здався бо довкола багато проектів вже з ним і треба спробувати)) Перші враження писати були гірші ніж перші враження перегляду від відосів з ютуб. Кілометровий рядок з утилітарних класів, не зрозуміло що писати… Ситуацію врятували плагіни: сортування класів, автоматичне перенесення рядка, згортання рядка у … Далі справа за практикою і запамʼятовуванням назв, багато пошуку в документації того що мені треба в те як воно називається.
Я обома руками за підтримку укр контенту, але це якесь інфоциганство, а не відео І що до темної теми в тейлвінді - повне фуфло) Якщо гратсь з селектором "dark:" то в вас строка, яка зазвичай і так довжелезна, стає щє більшою. Довелоь свою реалізацію писати, що б один клас можна було для всіх тем одразу використовувати, і можна було зробити їх більше за одну А в цілму ТВ зі старту був топовую лібою
Та до інфоциганства тут ще довго, та й потрібно враховувати що ніхто не буде безплатно робити якісний контент. Мій час коштує дорого, а для створення відео його треба дуже багато.
Це супер фреймворк. Спочатку теж не розумів, але зараз кайфую. Багато вже масштабних та не масштабних проектів на ньому мною було написано, завжди якщо що можно додати на якую сторінку звичайний css якщо там складна якась анімація, але це буває рідко. На рахунок вже готових компонентів то є багато безкоштовних сайтів де з прикладами можно скопіювати потрібний компонент фулл на теілвайнд).
ну вчити абсолютно нічого не потрібно, хіба як налаштувати в проекті, а все в документації читаєш кожний клас тай все, особисто я нічого не вчив, використовуючи по 100 раз вже само по собі запам'ятовуєш
![[Sub Thai] APT. - ROSÉ & Bruno Mars](http://i.ytimg.com/vi/bYjhzP8x_uc/mqdefault.jpg)
Теж не любив Taileind, але після перегляду відео, змінив свою думку, буду розбиратись 😮
Мені з першого разу нагадує Bootstrap ане inlineStyle, дякую за відео як раз дивлюсь + лайк, поставив на меті собі вивчати Tailwind CSS бо щось дуще велику популярність набрав)
Набирає популярність? Вже 2 роки майже на кожному проекті де працював був tailwind. Дуже класна штука
tailwind це найкраще що сталось з css з розробниками.
це робить підтримку просто неймовірно легкою...
це відчується через років 10 на проєкті де відповідально ставились до стилів і через 2 роки на проєкті де клали на стилі. всі стилі локалізовані до елементу - чи не казка це? не треба думати чого той довбаний блок трохи пливе
накидав собі кілька класів по перших буквах css властивостей і горя не знаю 😅
тим паче 90% використання це щось типу class="d-f jc-sb g-15" що аналогічно "display:flex; justify-content:space-between;gap:15px"
Я придбав за 150$ набір компонентів Application UI у TailWind для своєї Angular бібліотеки і не нарадуюсь. 150$ - це ж ціна лише 3-5 днів роботи розробника. Самому таке не написати
Tailwind це єдиний CSS фреймворк який дозволяє швидко розроблювати і легко підтримувати проект
може підкажете якісь варіанти вирішення проблеми з тим, що стає складно орієнтуватись в блоках розмітки, при використанні тейлвінда?
Inline fold
@@stormbraker637 дякую, та трохи не те. Наприклад при дебагінгу буває складно зорієнтуватись, де в коді той чи інший блок. При використанні БЕМ, це легко за рахунок кастомних класів.
@@maksss93 так э же компоненти
@@stormbraker637 так, але інколи трапляються ситуації, що в 1му файлі може бути кілька компонентів. Наприклад картка товару, котра має опис, шапку, якісь додаткові данні. І знайти саме потрібний блок коду безпосередньо в розмітці стає складніше. Наприклад через дев тулс його відтетектити, та в коді складно знайти. Особливо якщо писав інший розробник. Я гуглив і як рішення пропонують давати в розмітці класи по БЕМ, але ж тейлвінд для того щоб від них відмовитись. Також є варіант писати HTML коментарі, але тут проблема що вони не мають потрапляти в прод, тому потрібно ще писати плагін котрий їх прибиратиме. Цікаво може є ще якісь практичні рішення)
А чи є сертифікати після проходження ваших курсів?
Поки що нема. А він потрібен? Ніхто і ніде його не визнає зараз. Це лише для підняття власної самооцінки. Я зроблю сертифікати коли курс буде готовий повністю.
@@MaksymRudnyi а з чого ви зробили висновок, що сертифікати не визнають? Чи ви суто про сертифікати ваших курсів?
Дійсно цікава ваша думка, без образ
Я про більшість сертифікатів, і свої в тому числі. Сертифікат має цінність якщо його видає організація або людина яку всі знають і поважають. Мене знає мало, нажаль.
@@MaksymRudnyi а краще резюме без сертифікатів чи із сертифікатами від невідомих авторів, на вашу думку?
@@IhorVyshniakov на одному вебінарі рекрутер сказала що вони відсіюють резюме одної великої айті школи, тобто просто не беруть того в кого вказаний її сертифікат (підозрюю що це GoIT, так як тоді розглядались CV для прикладу, і якраз в чувака був фулстак гоайті курс) Зрозуміло що це в одній канторі так, але заставляє задуматись, так як айті школи дійсно клепають не завжди достойних розробників
Зрозумів, що Tailwind фігня. Дякую 😜
не розумію tailwind, навіщо костилити конфіги та вигадувати новий css, коли можна організувати сss через smacss, бем чи інші методології (імхо)
Для того, щоб не витрачати час на написання унікальних класів там, де це не потрібно. Бо 50%+ часу роботи з умовним бем це дрочиво із серії "вигадай унікальний клас для схожого на попередній блок щоб написати {display: flex; flex-direction: row; gap: 12px}" щоб зробити ряд для секції з двух дочірніх елементів. А в tailwind це ="flex gap-3" Коли це лендос - ще можна викрутитись тільки з бем, а коли величезна якась адмінка - вже проблема. Умовну складну карточку товару дійсно простіше робити з умовним бем і стилізувани з css, як і всі інші елементи у яких більше 1 або 2 візуальних станів. Але ж коли ти будуєш інтерфейс - все зводиться до "в ряд" або "в колонку". Найзручніше - комбінувати. Складне - css, просте - tailwind css.
@@Oleksii-t7c ага, тобто краще витрачати час на налаштування цього лайна, ніж робити так, як нормальны люди ? ))) а чому б просто тоді не писати звичайні інлайн стилі ? може треба згалати чому інлайн стилі це не гуд ? Назви класів дратує ? - а шо не так з модулями CSS ?
Ні-ні-ні. Для маленьких проектів чи своїх проектів - ок, швидче писати стилі. Але для великіх проектів, котрі умовно завтра стануть легасі, писати на всяких бутсрапах чи тайлвіндах - егоізм. Це аж ні як іншим розробникам не допоможе працювати з цим проектом. Той ж Гугл розробляє свої проекти як можна простіше, хоча може дозволити робити все дуже складно, бо там працюють круті інженери. Але ж таки пишуть просто і ясно.
Одже - витрачати час на настройку тайлвінд, чи витрачати той же час на роботу наприклад з SCSS. Але ж з SCSS після мене сможе працювати любий джун. А з інлайном тайлвінда у дві строки й сеньору буде не зручно. Вибір ???
Фууу бем ...😮
@@Oleksii-t7c що заважає зробити 1 раз нормальний ui-kit з компонентів та перевикористовувати?
@@Oleksii-t7c Замість вигадування зрозумілих для людини назв, кожен раз формуюється анонімна група гінвно класів, що неможливо підтримувати.
PurgeCSS, то скоріше для старих версій, коли за замовчуванням збирався повний бандл, а тобі потім треба було вручну запускати очищення. А так дуже корисна штука, я його додав до свого gulp-конфіга, й і з Bootstrap використовую, і коли треба почистити стилі над якими до мене працювало кілька розробників і зараз там чорт ногу зламає.
А для самого Tailwind головне запам’ятати що 4 це 16px, і розміри та відстані розраховуються кратно цьому :)
4- 1 rem
@@stormbraker637 і це також треба пам’ятати :)
Концепція Tailwind подібна на концепцію JQuery, тільки в CSS.
це більше схоже не на jquery а на HTMX
Ні, не запевнив) всі переваги так само легко реалізуються через CSS-in-JS
Звісно можна. Я працював що з тим що з іншим, то тейлвінд простіше.
Ще забув згадати у відео що з Tailwind нема проблем при серверному рендерингу. CSS in JS має певні обмеження.
Css-in-js - дуже повільний, як на мене. Зараз взагалі тенденція така, що все, можна зробити через css, має бути зроблено через css. Tailwind - дуже класний інструмент в плані набору утіліт для лейаутів. Все інше можна писати звичайним css. Якщо у вас макет, наприклад, зроблений за якоюсь систему відступив, то завдяки TW у вас грубо кажучи буде тільки 3 класи, типу mb-4, mb-8, mb-12 і все одно скільки у вас компонентів. А ось якщо це писати в кожному компонентів звичайним css, та ще й через module.css, то порахуйте, як роздується бандл. Так, можна просто самому створити ці утілітарні класи, але ж їх потім складно підтримувати. Тому кодогенерація - це добре)
Аргумент про відсутність потреби у змістовному іменуванні це головний цвях в труну тейлвінду. Написати швидко - підтримувати ніяк :)
черговий бутстрап, жахливий досвід, зайвий гемор на проекті
Класна заміна бутстрап , приємний досвід, спрощення стилізації на проекті
Є конфіг в який можно забити стайлгайд
З власного досвіду, TW - просто іграшка. Можливо для React це ще ок, я пишу на Vue, і там це не дає майже нічого. До того ж, можна просто освоїти пару PostCSS інструментів, і результат буде ще краще.
Він точно не для всіх проектів, але його пхають всюди, і просувають з кожного "вікна".
динамічні класи - є сейф ліст - який буде створювати потрібні класи
переваги - якщо шариш тайлвінд - легко писати - розробка
недоліки - вхідний поріг, складніше парсити-дебажити - підтримка
Дуже не хотів його вчити і казав що буду тільки на проекті на ходу розбиратися. Але потім здався бо довкола багато проектів вже з ним і треба спробувати))
Перші враження писати були гірші ніж перші враження перегляду від відосів з ютуб. Кілометровий рядок з утилітарних класів, не зрозуміло що писати…
Ситуацію врятували плагіни: сортування класів, автоматичне перенесення рядка, згортання рядка у … Далі справа за практикою і запамʼятовуванням назв, багато пошуку в документації того що мені треба в те як воно називається.
CSS-in-JS - це той самий Tailwind, але без необхідності вивчати купу дублючих імен та мержиться чудово.
Я обома руками за підтримку укр контенту, але це якесь інфоциганство, а не відео
І що до темної теми в тейлвінді - повне фуфло) Якщо гратсь з селектором "dark:" то в вас строка, яка зазвичай і так довжелезна, стає щє більшою. Довелоь свою реалізацію писати, що б один клас можна було для всіх тем одразу використовувати, і можна було зробити їх більше за одну
А в цілму ТВ зі старту був топовую лібою
Та до інфоциганства тут ще довго, та й потрібно враховувати що ніхто не буде безплатно робити якісний контент. Мій час коштує дорого, а для створення відео його треба дуже багато.
Не потрібно придумувати назви це кіллер фіча. Shut up and take my 💵 🙂
А потім не будеш знати що робить кожен компонент. Тому Tailwind - це генератор гівнокоду: легко писати, неможливо підтримувати.
Tailwind вже переміг
Це супер фреймворк. Спочатку теж не розумів, але зараз кайфую. Багато вже масштабних та не масштабних проектів на ньому мною було написано, завжди якщо що можно додати на якую сторінку звичайний css якщо там складна якась анімація, але це буває рідко. На рахунок вже готових компонентів то є багато безкоштовних сайтів де з прикладами можно скопіювати потрібний компонент фулл на теілвайнд).
ну вчити абсолютно нічого не потрібно, хіба як налаштувати в проекті, а все в документації читаєш кожний клас тай все, особисто я нічого не вчив, використовуючи по 100 раз вже само по собі запам'ятовуєш
Э плагіни для ide