For me the problem with tailwind is that I've already know very very well css even before tailwind was born. I'm too lazy to search tailwind classes stuff, i do complex css faster with vanilla css. I LOVE CSS it took me years (since HTML4 with CSS Level1) to master because its always in development. If I was a newbee i guess i would preffer tailwind and stuff - but i don't need it.
How often do you have a problem where you need to style one instance of a element differently then any other. Like that one special button needs to be like a regular button but it needs something extra special. Then you decide to add a new class name for that special button and with all the styles special for that button. You need to come up with a good name for that class name. You do it but it does not work. Why? Because your new styles have less priority then the default styles because there is some rule like ".form > div > button" and now you ether have to use !important or if some other hack to make your new style have the highest priority. Problems like these is where tailwind shines. When you make your Button component in whatever framework you want, you can make a prop like and that component can internally use tailwind-merge to merge the default styles for every instance of Button with the specific styles that this instance of the Button needs to have. And when you inspect the button element, all the styles that can be applied to that element are right inline with the element. No sneaky ".form > div > button".
@@ParkourGrip you made me laugh with all the !important mess... reminded me why i ran away from bootstrap. i think tailwind is awsome specially for developers who dosn't do web design. i do both first the design process and then develop front-end vanila js or reactJS and back-end with php Laravel and then i die :)) as i look at what i've just wrote here, its like from the "control freak diaries"
@@Salamaleikum80 tailwind is awsome specially for vanilla developers - i didn't really have a name collision problems even when using just vanila JS - its just another tool to learn things that i already know... so why bother? well, i botherd because its everywhere and when for example installing Laravel framework or Vite project you can't ignore it - developer must know things that not always will use, but good to know, customers have tailwind in their projects. if you want to be professional you need to know these things for your future clients :)
From time to time, I look at projects that use Tailwind CSS. I can often tell immediately that the developer was not well-versed in CSS because of the number of unnecessary classes I see that would make inline CSS seem like a more viable option... but at the end of the day, the client can't tell what you used, so use what you like.
I am always using Vanilla CSS, it always supports all new features and I do not need to wait them to be implemented in the Tailwind. I tried Tailwind but I do not like it because of a lot of class names inside markup, it is not readable at all.
@biLLie_wiLLie The unexpected behavior in Vanilla CSS often stems from a lack of understanding of how CSS fundamentally works and how its core principles-like specificity, inheritance, and the cascade-influence the styles applied to elements.
😅 Yep, he talked about it a year ago i guess... you already can imagine what he preffers. btw, like i do Vanilla CSS only but its because CSS and I got Old together - i know it since its first version long time ago...
I tried tailwind multiple of times. It never clicked with me.. So I prefer using vanilla CSS (sass / less). Also where I work, we are not using tailwind anywhere. Tailwind feels like inline styles but as classes and the code can look ugly (9:50)
definitely agree. We are using components, where we are trying to apply Separation of concerns. With typings, different helpers, storybooks, tests even the simpliest component can become a clutter. Why not split css, if we are already trying to split everything else?
Ever since I stumbled upon Tailwind in 2019, I've been hooked on it. And never have I been more productive. Mainly because I don't have to come up with verbose class names anymore.
Class names are valuable because they document the code you’ve written. Using descriptive names makes the code easier to understand. For example, using a class name like accordion-header provides clarity about its purpose. However, when using Tailwind CSS, you often don't have that additional semantic layer since it relies on utility classes instead of descriptive names
@@DaKruzze true, I view it as tailwind: strong start, productive and fast deliver but when the app gets complex, it's hard to maintain and adjust the css while css or sass: slower, not as productive but when the project progress you will see all the hard effort you put by organizing the names and style sheets so it's easier to maintain and adjust the css code for a long run.
@@DaKruzze With components in frameworks like vue or react I simply put those descriptors one level up. So instead of the class .accordion--header I would use a component called . That is, if the component becomes so large that it needs to be divided into sub-components. Usually I'm fine with a good old // Header comment in the main component.
@@Quabbe2 yeah, I think most of the complaints against tailwind are likely in environments where component based framworks are less common. With decently designed components, the tailwind classes don't need special names like "accordian" because they're directly attached to the accordian, whereas in a more traditional html document that kind of split would probably be more useful.
I'm in the vanilla CSS team strongly, i know it very well and the idea of installing a plugin to enable features that are already available in the browser for me is mindblowing. Also not a fan of putting all the styles in the HTML, like I never liked CSS in JS. 1 file components like Vue and Svelte are the perfect balance for me and also allow some degreee of assistance from the IDE. I think is much better to learn a good pattern that you can adapt depending on the situation instead of big libraries to have little syntax convenience, especially now that the amout of boilerplate you have to actually write is little since Cursor/Copilot does it for you.
Once a style for a component stabilizes, we could move it out to a custom class and use @apply to park it outside, especially when its a lengthy combination. One or a couple of individual classes like flex flex-column can stay right in the HTML.
I find best for me to use both tailwind for like 95% of the code but sometimes i need some specific flashy stuff thats hard or impossible to do with tailwind so i use global css file to give style classes for those
Maximilian, interesting thoughts. I've been using TailwindCSS for quite some time, and overall, I'm very satisfied with it. On one of my ongoing projects, I use it in combination with DaisyUI (highly recommend it), which makes the work even easier and offers additional features and capabilities. However, if necessary, I can also work with plain CSS along with one of the preprocessors.
I like Tailwind because it allows experimental features that aren't supported on all browsers yet, by filling in what is needed to do so. It is shorter and faster to write. It has built in colors / sizing, etc. You can drop in theming by editing the config file to add your own classes etc if needed. But one of the biggest reasons is because I don't have to come up with names for classes or ids on things and worry about BEM etc. Also, it's integrated in the other frameworks I use, such as Astro.js or Next.js
I started using Tailwind CSS recently, and I find it easier to write styles. and I find some convenient part about it. 1. You can copy some code to somewhere else, and it will look the same. There is no need to extra consider css stuff. 2. You copy the DOM's classes from the browser, and the code editor will match the right code position most of the time. I used to think that a long string of classes was really ugly. Now I don't think it's something unbearable.
I like to use CUBE CSS methodlogy with BEM and Tailwind. It creates a nice css semantic class names and as well utility css class name when you really need to use it thanks to Tailwind
I'm trying to learn tailwind, I am as stubborn as a mule, and the industry loves tailwind, so if I learn tailwind, I'm set for standard stuff, but I don't plan to do something that is completely out of left field, I just want an admin dashboard :< That being said, I just learned that tailwind let's you put gradients in the background, that's pretty much as far as I think i'm ever going. Also, sidenote, I use laravel, so when I eventually do use tailwind in my projects, I'm just gonna stick everything into components, then boom, clean code in my project, out of sight, out of mind :)
A big feature I love about Tailwind is that it has a design system out of the box that scales with your project. It's pretty simple to restrict or extend the utility classes available. When combined with a modern component framework, you can abstract any "ugly" html templates into their own component, which cleans up the rest of the markup. In addition, you don't have to spend unnecessary time thinking about a CSS class name based on the structure of your html, especially those one-off wrapper elements that are for pure styling. Yet another perk is you only ship the CSS that's being used, reducing the bundle size.
The main reason why I prefer to use tailwind is because its easier to figure where all the styles that are applied to a element are coming from. It's right there inline where the element is. No cross referencing different CSS files and figuring out what style overwrote what style because of some complex priority algorithm. Also tailwind-merge makes it super easy to make components that have a default style and a component prop witch you can use for specifying some additional styles that a instance of the component needs to have. There is always that one instance of the component that needs to have a slightly different style to make the page look correct.
The most important thing is to know and to understand vanilla CSS. Then, you will be able to use any other CSS framework or opinionated frontend libraries (like Material UI). Tailwind standalone is just another Bootstrap (much, much better than Bootstrap), its strenght is, that if you are using Tailwind you are open for ShadCN, Beautiful UI, v0 and other tools.
-Yes and No, -Maybe, -On the other hand -But..., - etc So, what's the conclusion? what's your preference? What do you specifically recommend? because now I'm even more confused than before.
I gotta keep it real id rather starve to death than give up tailwind at this point. This is one of those technologies that changes DX so much, the alternative becomes an impossible step back.
Vanilla CSS only with SCSS preprocessor. Cannot really stand having so many classes on html. Makes it hard to port the html code to another project which have a totally different layout.
at least tailwind is not a component framework. I had a project with a UI framework that was providing components which wasn't updating to vue 3 for over a year and made the project stuck on vue 2. I rewrote everything to tailwind to have normal HTML again and to never be dependent on components from a third party again. now I can theoretically just swap styling without breaking the html.
When deciding to use Tailwind CSS, keep in mind that you should approach your project with a component-driven mindset. Strive to make each component as small as possible, adhering to SOLID development principles. Additionally, try to find combinations of styles that can be encapsulated as components. Address the limitations of Tailwind by using its directives, such as @apply, to create your own component-based classes.
I prefer Vanilla CSS. It is easier to read, easier to write, WAY easier to maintain. more flexible, and wont be obsolete in 5 to 10 years. It does, however, require you to know what you are doing when it comes to CSS, which unfortunately is where 90% of front-end dev drop the ball
Same as to guy before: Tailwind is based on CSS. It's just faster. If you prefer clean code, you can use separated css files and just style with @apply directive. It works exactly same like classic class or id binding, but it's a lot faster. You can also use classic CSS units. You dont write max-width: 720px, you write max-w-[720px] or max-w-[80vw] instead, right inside class attribute. But you can freely use CSS and Tailwind together, if you writing, for example CSS animations. You are not limited to write only Tailwind or only CSS. You can even write both in the same file. Tailwind CSS is a industry standart right now, it won't be deceased for very long time. Don't worry about that. 😀
@@Biglu193 twitter and youtube influencers is not real life. Tailwind is by no means an industry standard. If people enjoy tailwind that's fine, to each their own. I find it harder to read, harder and slower to write, way harder to maintain. Using @apply is the same except you lose the "advantage" of colocation in the first place. A middle ground I've found alright is to use ailwind, the utility css library, for...utilities, as in I'll use it if I only need a class or two, like a flex container, but if I need more I will use a real css selector and write real css since it's easier and more maintainable.
@@darialyphia I think it is more than obvious from the offers of positions on the market what is the industry standard and what is not. We don't need to talk about this at all. Many companies have projects built on outdated technologies and are desperate for people to maintain them. (I saw offers even on Delphi) These people are not looking for a candidate's ability to work with preprocessors because they see the future in them, but because they have no choice. But i got it. You like vanilla CSS, SASS, SCSS and enjoying it. There is nothing bad with it. Beauty of the Tailwind CSS is, you can use both, CSS and Tailwind together, without any limits. So i can't even understand, why people fighting, which solution is better, because it doesn't even matter. 🙂 It's like an argument between Context and Redux users, or AWS and GCP users, Prisma and Drizzle users....😀 Im posting some info about Tailwind, because a lot of people here don't even know, how it works. It's not your case of course. 🙂
for me, the answer is very simple: use and stick with the standards that are better for your team. Tailwind is a great library that makes more optimized results (both in terms of size, repetition, and unused code), I still prefer CSS/SASS, but saying that Tailwind is harder to maintain or anything like that is just bs, like anything else it has some learning curve, and in a lot of teams/projects it will improve the speed and maintainability for sure.
I'm from old school so I passed through out all the process from vanilla css, sass and all the architectures proposal end up with BEM as my favorite. It's just recent that I'm starting experimenting with this atomistic architecture framework of tailwind because of React where Sass lost sense or at least I don't find it too useful because of the way we use module css on each component.
I tried. I really did try to give tailwind a fair shot. But I could not get myself to like it. It's very intuitive but I hate how my html looks. Even with the tailwind plugin, I have a hard time making sense of an element with lots of classes, mainly the ones with light/dark theme support and animations
I think tailwind is appealing and recommended for beginners. But for veterans who have CSS hardwired in their brains, it's a tough cookie. They will be more productive in CSS. I would use tailwind just as a more compelling replacement for bootstrap. (mostly for responsiveness aspect) Also, a big aspect of tailwind ,, it's standardization. Meaning people can leave and hop on projects easier. Since you don;t have to learn what the custom CSS classes do or where they are declared.
I'm wondering why we don't speak about middleground between both worlds. I think Stylex from Meta could be a good way to get the best from both world. What do you think about it ? Thinking out of the box of "Tailwind vs CSS", I'm curious to have opinions about it
Vanilla css is great for complex shared or common components. Tailwind for standardized styles like padding/margin values or short cuts for doing flex or bold. That being said, I was really hoping the style library pollen would take off that
Once you use Vanilla CSS, then switch to Tailwind CSS, then switch back to Vanilla CSS, you never go back! Here's why: You are probably writing CSS wrong and don't even realize it, then switching to Tailwind CSS provides you a huge amount of inspiration for how to organize and group object oriented styles... Then you apply that strategy/paradigm back to Vanilla CSS, your Vanilla CSS gets WAY better and even EASIER and FASTER and CLEANER than Tailwind.
Learn CSS and start creating templates. Once you build up versions of various components, you are likely to have on hand examples of things which are close enough to what you are looking for so you might need to tweak it for the needed application. The more work you do the more samples you have to where the idea of needing a 3rd party tool doesn't really feel like a need. In short, be your own framework.
We must always distinguish what we do, production and prototyping are different concepts. We are certainly free to use both but obviously it would be better to use them in the right development context.
Im using pure css and couldnt be happier. It has layers, variables, nesting and wont ever be outdated like tailwind. Also it doesnt force your devs to learn a DSL. When i try to write tailwind it takes me 10x longer to write and 100x longer to read/debug as i have to go through the docs each time.
I like the way of writing in Tailwind. I don't like that I have to learn a new syntax to do what I already can do easly with css. That's why I created my own css framework.
Me thinks that it you definetely should be good at CSS before allowing yourself to use tailwind, its always important to know HOW things work, will help with debugging later.
what people in the comments seem not to realize is that: - tailwind is more oriented to help frameworks that have a templating engine. Meaning you have a component, be it reusable or functional, and you add tailwind on top to make it look nice, meaning a component approach - when going the css, the design takes then main stage, functionality is added on top(mixed or as a secondary concern) Also css naming is and is not standardized. If you mostly worked with design and did your research in regards to design that's nice and all but you are a designer. When you're a developer that needs to take many other things into account, splitting your attention and your mental capacity to also include css is not easy, because CSS has become very complex. I am saying this as an actual fullstack dev that started on the front side of things and migrated more to back (maybe 30/70% split) and in the past years i did try to read what interacts with what and how this and that works but when you have too many technologies in your head some are a second taught.
It's too easy for a separate course. Trust me. 😀Take CSS3 course instead. If you know a CSS, you know also Tailwind. Go to Tailwind CSS docs and after a hour and half, you will be able to use it. If you dont know CSS, learn it first. You can't understand Tailwind without understanding CSS.
I see similarities between jQuery and TailwindCSS. At some point (a long, long time ago), jQuery was everything for me, until I realised I do not need it at all and can do all and more with VanillaJS. The same goes with TailwindCSS-handy, easy to copy and paste, and no need to learn CSS. However, I'm not sure why I would use it if I know and love CSS. I like clean HTML and structure, and it is easy to adjust to whatever crazy requirements I might get from the client. I don't want to be boxed and adjust crazy configs just to get another plugin to work for Tailwind.
well, we all used jQuery at that time because vanilla JS lacked simple things like css class selectors. there was no such things like querySelector in 2014.
"you dont have to learn css" is the least interesting feature of tailwindcss. if true at all. This argument in combination with "readable code" is for me just an indicator that author is mostly designer and/or not maintaining older projects (especially not the ones from other people in the team). Vanilla css readibilty depends heavily on the author, so if youre not the one writing it, often is a headache.
@@MirkoVukusic On a contrary, I like to "dive in" in old CSS code base and re-write inside out. The "you don't have to learn CSS" came after observation on how Tailwind guys use it. Tailwind is great and probably all depends on use cases. I simply prefer clean HTML and corresponding CSS in agreed methodology, be it CUBE, or any other approach. Maybe I really don't get the Tailwind and maybe I need to dive deeper then couple prototypes but the maintenance of class soup is not my "plate" :)
@@andrisshvarcs , I like it too. I love "clean" and "optimized". I guess that comes wit being passionate programmer. But on hobby projects. When it comes to work, especially on the team, I just cant rewrite project css every time I want. And I'm loosing time massively on searching css files... on naming classes (people underestimate this!), not to mention media queries, simple animations, etc. Also, I'm not much of a designer nor I like doing it too much. I spend hours just on padding stuff which kills my programming focus. People underestimate tailwind's design standard. So yes... don't give up on it. It takes time to get all aspects of it. I hated it. Took me 3 projects to get it. But this video is great... we should never just "forget" vanilla to be good at either.
@@MirkoVukusic@MirkoVukusic Somehow, I believe I will get the Tailwind project sooner rather than later; it is inevitable. :) I definitely try to keep an open mind and once the opportunity comes I will dive into it for sure.
I mostly prefer the vanilla css, but I found tailwind as most efficient way to work. Sometimes it is difficult to customise the tailwind so I prefer both option.
theres only one huge factor where tailwind really shines: speed of development (once one learn the utility classes names). yeah, there's the 'readability' and 'ugliness' factor... you can use Tailwind Fold extension for VScode if that really bothers you.... but does not bother me when working on a based component system like react, vue, svelte, etc. thats my conclusion after 15 years of front end development. i used to write a lot of plain vanilla css, and also used a lot the most popular frameworks / libs of the past like bootstrap, foundation, etc. on the down side, i found when in dev mode compiling times using tailwind on mid size nextjs projects can become really slow.
but for beginners, here's my humble advice: learn plain css before tailwind css. one should learn the fundamentals of css before using any css lib or framework.
Vanilla CSS is very powerful and that's its biggest disadvantage. Features like inheritance look great theoretically, but it introduces complexity and issues, especially if it isn't your codebase.
I learned TailwindCSS because I was curious but I prefer Vanilla CSS. I think TailwindCSS makes sense when multiple developers are working on a large project, but otherwise, I don’t see any advantage. I have to say, though, that the documentation of TailwindCSS is good.
If you are on a large team - tailwind is fine. You'll want the consistency. If you want to win awards, not look like everyone else, and work in very small groups, - vanilla. We don't need these frameworks. They just get in the way. Get good at Grid, and Flexbox. Experiment. These frameworks became popular when companies started leaning into "full stack" developers. They LOVE this stuff, but they are busy, so they can't spend their time on actually learning CSS properly.
If you're whining about tw, it's probably bc you're raw dogging it inline. Use it with scss and component classes. That's what we do on real projects. I know, the docs don't really tell you that.
Vanilla CSS is perfect. Tailwind allows you shortcuts to writing too much code. I use them both interchangeably. For example you have repeating elements that you suddenly decide to add a bunch of css rules it's quicker to make a vanilla css custom class than add all those classes to each element. Then you only need to give them one class and you're done. Need to change them in the future? Just go to your css file and change ONE class instead of going to each repeating element and removing what no longer fits there. On the other hand tailwind allows me to be lazy and slap a quick class on an element the right way instead of doing it inline. Both technologies have their uses, I'm not an absolutist here
If you're using a framework there nothing stopping you from extracting the repeating elements to a component so you don't have to change it in multiple places. It's all preferences my dude.
... but you have to *find* that class first. Sometimes years later. Then you have to find out if its used elsewhere and how the change will affect those. If youre not working alone, all this you need to do in someone else's code. You make it sound so easy, but its not in practice. Btw you can do the same in Tailwind, easily, but its dicouraged , tor the good reason. Bototm line, use components for repeating items. Has nothing to do with css, its just reall good practice. if ots really samll one and you dont feel like it... you can target children styles from parent element in tailwind, just like in vanilla css.
You can use it anywhere you want. Static sites, React, Node, Laravel, Vue, Svelte, Angular, just everywhere.... You can use it via CDN in a single HTML file, if you want. 😀
@Biglu193 damn its been a long time. i really want to be a web developer now im just a delivery driver so my brain is a little bit rusty i hope i can still get it
Iteration argument: - inline styles Flexible: - it cannot be more flexible than css (tailwind IS ultimately css so .. DUH!!) - it is NOT easier to start with than css considering it has more classes than css has properties Also, inline styles are not considered to be a good practice because of the reusable fallacy. A decent software engineer can figure out what should or should not be reused and can pivot his decisions in favor of reducing complexity. And by reducing complexity I mean 4-5 indirections. The code in the industry today is not unheard of to have a 10 to 15 long indirection chains that can be substituted with 3 lines of code. 10 years ago, building a complex solution was measured in months while nowadays it is measured in decades. 10 years ago those solutions took 5 figures to maintain, now it is 7 to 8 figures. There are 2 types of software professionals, those who have no idea what they are talking about, and those who know that they don't have an idea what they are talking about. You are in the process of becoming the 2nd. Cheers!
2 หลายเดือนก่อน +1
If I use vanilla, I end up creating my own tailwind but buggy and wrong 😅
Fortunately tailwind don't vendor lock us We can just write tailwind and when pure CSS make more sense we can just use it Additionally because we don't create many classes, we can think less about conflicted names
With Tailwind you don't just commit to a methodology, but to an entire opinionated ecosystem with its own configs, compiler etc. Since I'm mostly working on big products with a very long runtime (8-12 years), Tailwind is simply not an option. Having worked with (now) legacy JS and CSS frameworks over the past 12 years, avoiding dependencies on ecosystems like that is my biggest lesson. Any new add-on that you decide to depend on for short term gain will potentially hit back at you in years to come. The adaptation of new CSS features by browser vendors nowadays a pretty good, and I already said farewell to my once beloved SASS. But Tailwind will probably be much harder to get rid off if you ever decide to. For short term projects (1-3 years), Tailwind is probably a safe choice. For anything longer, stick to vanilla and web standards as much as possible. Thank me later. :)
Tailwind is an abomination of an extreme end of what happens when someone refuse to follow the standards and want's to reinvent whatever just for the sake of it. You want more then css can do out of the box ? Sure make it compile time with sass and call it a day. Everybody in their right minds came to the conclusion that inlining css into templates is a bad practice that is counter productive and then years after that some dudes that pretend to know better try to push inlinining css under the cover of shorter aliases in a class instead of style, nice job. Wanna write css fast ? Use emmet. Wanna do it with superpowers ? Use sass.
Tailwind css or nothing, why wasting your time writing vanilla CSS? specifically in big project. Those who are saying Vanilla CSS is better for readability don't know how to use tailwidcss.
Web components make Tailwind completely unnecessary and an inefficient developer experience by comparison. With shadow dom encapsulation you can just style elements directly. Soooo much better than having to add a bunch of classes.
It's bizarre witnessing developers who are 1000x smarter than me, incapable or too lazy to use a pre-processor instead of CSS frameworks that bloat up HTML so they can be more "productive" (and having every website and app look exactly the same like a bot made it). The wilder part is I'm viewed as a "lame" "boomer" because I semantically name ids/classes and apply the "framework" concepts used in a pre-processor behind the scenes which gives me the power to handle layouts and themes without touching the code that generated the HTML. It's like watching the hypebeast Macromedia Flash era happen again 🤷♂🤣. R.I.P. Jason Knight, now I understand why he was so frustrated with the web developer community.
@@M-lt6kx Why is not having to touch the markup due to understanding the concept of semantic HTML, classes/ids and user-agents a negative? Yes, I make CSS Zen gardens, and can make zen gardens for non browser user-agents too. I'm a "lame" "dummy" who isn't a "web-app" hypebeast. 🤷♂
@@mrdmajor Tailwind doesn't prevent you from writing semantic markup and semantic class name conventions get more difficult as a codebase and its contributors grows. I'm not here to call you the names you keep calling yourself, how other devs choose to build their apps is up to them.
@@M-lt6kx is not semantic. It's bloated HTML to make developers productive specifically to one user-agent when the majority of them are not building Figma/Adobe level applications. The part that is bizarre, is narratives stating how defining what a thing IS with HTML classes, is so difficult as code base and contributors grow, meanwhile types, interfaces, structs, enums don't cause that issue... 🤷♂
@@mrdmajor your example gives me more info that class="special-box special-box--different". You hangups about user agents might be specific to you but as a dev lead on large scale projects across distributed teams tailwind has proven to be more maintainable than any CSS, BEM itcss alternative. But as I said, I dont really care what other people choose to use. Do what you enjoy
nice channel, but this is a completely useless video imo, nothing new is said here like of course some people should sometimes use vanilla css feels like a video made just for the sake of publishing one more video
For me the problem with tailwind is that I've already know very very well css even before tailwind was born. I'm too lazy to search tailwind classes stuff, i do complex css faster with vanilla css. I LOVE CSS it took me years (since HTML4 with CSS Level1) to master because its always in development.
If I was a newbee i guess i would preffer tailwind and stuff - but i don't need it.
that was exactly how I felt, and that using frontend frameworks already solve the problem of name collisions.
How often do you have a problem where you need to style one instance of a element differently then any other. Like that one special button needs to be like a regular button but it needs something extra special. Then you decide to add a new class name for that special button and with all the styles special for that button. You need to come up with a good name for that class name. You do it but it does not work. Why? Because your new styles have less priority then the default styles because there is some rule like ".form > div > button" and now you ether have to use !important or if some other hack to make your new style have the highest priority. Problems like these is where tailwind shines. When you make your Button component in whatever framework you want, you can make a prop like and that component can internally use tailwind-merge to merge the default styles for every instance of Button with the specific styles that this instance of the Button needs to have. And when you inspect the button element, all the styles that can be applied to that element are right inline with the element. No sneaky ".form > div > button".
@@ParkourGrip you made me laugh with all the !important mess... reminded me why i ran away from bootstrap. i think tailwind is awsome specially for developers who dosn't do web design. i do both first the design process and then develop front-end vanila js or reactJS and back-end with php Laravel and then i die :)) as i look at what i've just wrote here, its like from the "control freak diaries"
@@Salamaleikum80 tailwind is awsome specially for vanilla developers - i didn't really have a name collision problems even when using just vanila JS - its just another tool to learn things that i already know... so why bother? well, i botherd because its everywhere and when for example installing Laravel framework or Vite project you can't ignore it - developer must know things that not always will use, but good to know, customers have tailwind in their projects. if you want to be professional you need to know these things for your future clients :)
@@drorkatzir that is literally the only reason why i learned tailwind
I was a die hard vanilla/ sass user but once I tried it I never went back from tailwind
bro same 😂
I deep down shamefully admits the same.. tailwind is like a drug that you're used to it wether you like or dislike it😢
With modern CSS you have less need for Sass as you can use CSS variables and write nested CSS.
@@fred.flintstone4099 still you cant rely today on nesting css support.
Same, but I use postcss/nested. Some complex components needs custom css :D
From time to time, I look at projects that use Tailwind CSS. I can often tell immediately that the developer was not well-versed in CSS because of the number of unnecessary classes I see that would make inline CSS seem like a more viable option... but at the end of the day, the client can't tell what you used, so use what you like.
I am always using Vanilla CSS, it always supports all new features and I do not need to wait them to be implemented in the Tailwind. I tried Tailwind but I do not like it because of a lot of class names inside markup, it is not readable at all.
You know TW is just CSS and you too can use any CSS with it, and you too can make your code readable with TW. You too can beneifit from TW.
I always use Vanilla CSS, it gives complete control over my styles and better readability.
And sometimes can give incomplete behavior
@biLLie_wiLLie The unexpected behavior in Vanilla CSS often stems from a lack of understanding of how CSS fundamentally works and how its core principles-like specificity, inheritance, and the cascade-influence the styles applied to elements.
@@biLLie_wiLLienope 😂 tailwind is incomplete
@@biLLie_wiLLieskill issue
Tailwind is based upon vanilla css, not the other way around. If vanilla css gives you incomplete behaviour then you don't understand css
I'd rather write my own project specific utility classes and keep my markup clean and readable.
You too can keep your markup clean with TW. It's not hard. If you can;t read TW, then you can;t read.
This would be a great conversation to have with Kevin Powell!
😅 Yep, he talked about it a year ago i guess... you already can imagine what he preffers.
btw, like i do Vanilla CSS only but its because CSS and I got Old together - i know it since its first version long time ago...
I tried tailwind multiple of times. It never clicked with me.. So I prefer using vanilla CSS (sass / less). Also where I work, we are not using tailwind anywhere.
Tailwind feels like inline styles but as classes and the code can look ugly (9:50)
definitely agree. We are using components, where we are trying to apply Separation of concerns. With typings, different helpers, storybooks, tests even the simpliest component can become a clutter. Why not split css, if we are already trying to split everything else?
Ever since I stumbled upon Tailwind in 2019, I've been hooked on it. And never have I been more productive. Mainly because I don't have to come up with verbose class names anymore.
that and creating a css sheet each time feels takeouts the joy haha
Class names are valuable because they document the code you’ve written. Using descriptive names makes the code easier to understand. For example, using a class name like accordion-header provides clarity about its purpose. However, when using Tailwind CSS, you often don't have that additional semantic layer since it relies on utility classes instead of descriptive names
@@DaKruzze true, I view it as tailwind: strong start, productive and fast deliver but when the app gets complex, it's hard to maintain and adjust the css
while css or sass: slower, not as productive but when the project progress you will see all the hard effort you put by organizing the names and style sheets so it's easier to maintain and adjust the css code for a long run.
@@DaKruzze With components in frameworks like vue or react I simply put those descriptors one level up. So instead of the class .accordion--header I would use a component called . That is, if the component becomes so large that it needs to be divided into sub-components. Usually I'm fine with a good old // Header comment in the main component.
@@Quabbe2 yeah, I think most of the complaints against tailwind are likely in environments where component based framworks are less common. With decently designed components, the tailwind classes don't need special names like "accordian" because they're directly attached to the accordian, whereas in a more traditional html document that kind of split would probably be more useful.
I'm in the vanilla CSS team strongly, i know it very well and the idea of installing a plugin to enable features that are already available in the browser for me is mindblowing. Also not a fan of putting all the styles in the HTML, like I never liked CSS in JS. 1 file components like Vue and Svelte are the perfect balance for me and also allow some degreee of assistance from the IDE.
I think is much better to learn a good pattern that you can adapt depending on the situation instead of big libraries to have little syntax convenience, especially now that the amout of boilerplate you have to actually write is little since Cursor/Copilot does it for you.
Once a style for a component stabilizes, we could move it out to a custom class and use @apply to park it outside, especially when its a lengthy combination. One or a couple of individual classes like flex flex-column can stay right in the HTML.
I find best for me to use both tailwind for like 95% of the code but sometimes i need some specific flashy stuff thats hard or impossible to do with tailwind so i use global css file to give style classes for those
thanks this is the question i've beeb asking myself so long , i like vanilla css though
Maximilian, interesting thoughts. I've been using TailwindCSS for quite some time, and overall, I'm very satisfied with it. On one of my ongoing projects, I use it in combination with DaisyUI (highly recommend it), which makes the work even easier and offers additional features and capabilities.
However, if necessary, I can also work with plain CSS along with one of the preprocessors.
I like Tailwind because it allows experimental features that aren't supported on all browsers yet, by filling in what is needed to do so.
It is shorter and faster to write.
It has built in colors / sizing, etc.
You can drop in theming by editing the config file to add your own classes etc if needed.
But one of the biggest reasons is because I don't have to come up with names for classes or ids on things and worry about BEM etc.
Also, it's integrated in the other frameworks I use, such as Astro.js or Next.js
I started using Tailwind CSS recently, and I find it easier to write styles. and I find some convenient part about it.
1. You can copy some code to somewhere else, and it will look the same. There is no need to extra consider css stuff.
2. You copy the DOM's classes from the browser, and the code editor will match the right code position most of the time.
I used to think that a long string of classes was really ugly. Now I don't think it's something unbearable.
I like to use CUBE CSS methodlogy with BEM and Tailwind. It creates a nice css semantic class names and as well utility css class name when you really need to use it thanks to Tailwind
I'm trying to learn tailwind, I am as stubborn as a mule, and the industry loves tailwind, so if I learn tailwind, I'm set for standard stuff, but I don't plan to do something that is completely out of left field, I just want an admin dashboard :<
That being said, I just learned that tailwind let's you put gradients in the background, that's pretty much as far as I think i'm ever going. Also, sidenote, I use laravel, so when I eventually do use tailwind in my projects, I'm just gonna stick everything into components, then boom, clean code in my project, out of sight, out of mind :)
A big feature I love about Tailwind is that it has a design system out of the box that scales with your project. It's pretty simple to restrict or extend the utility classes available. When combined with a modern component framework, you can abstract any "ugly" html templates into their own component, which cleans up the rest of the markup. In addition, you don't have to spend unnecessary time thinking about a CSS class name based on the structure of your html, especially those one-off wrapper elements that are for pure styling. Yet another perk is you only ship the CSS that's being used, reducing the bundle size.
Just like how you should first learn JavaScript (or TS) before using a JS framewor, you should definitely learn CSS/SCSS before Tailwind.
The main reason why I prefer to use tailwind is because its easier to figure where all the styles that are applied to a element are coming from. It's right there inline where the element is. No cross referencing different CSS files and figuring out what style overwrote what style because of some complex priority algorithm. Also tailwind-merge makes it super easy to make components that have a default style and a component prop witch you can use for specifying some additional styles that a instance of the component needs to have. There is always that one instance of the component that needs to have a slightly different style to make the page look correct.
You said cuz “Its right there where the element is” so why not use inline CSS then ? Whats the difference ?
The most important thing is to know and to understand vanilla CSS. Then, you will be able to use any other CSS framework or opinionated frontend libraries (like Material UI).
Tailwind standalone is just another Bootstrap (much, much better than Bootstrap), its strenght is, that if you are using Tailwind you are open for ShadCN, Beautiful UI, v0 and other tools.
-Yes and No, -Maybe, -On the other hand -But..., - etc So, what's the conclusion? what's your preference? What do you specifically recommend? because now I'm even more confused than before.
I gotta keep it real id rather starve to death than give up tailwind at this point. This is one of those technologies that changes DX so much, the alternative becomes an impossible step back.
Vanilla CSS only with SCSS preprocessor. Cannot really stand having so many classes on html. Makes it hard to port the html code to another project which have a totally different layout.
at least tailwind is not a component framework. I had a project with a UI framework that was providing components which wasn't updating to vue 3 for over a year and made the project stuck on vue 2. I rewrote everything to tailwind to have normal HTML again and to never be dependent on components from a third party again. now I can theoretically just swap styling without breaking the html.
When deciding to use Tailwind CSS, keep in mind that you should approach your project with a component-driven mindset. Strive to make each component as small as possible, adhering to SOLID development principles. Additionally, try to find combinations of styles that can be encapsulated as components. Address the limitations of Tailwind by using its directives, such as @apply, to create your own component-based classes.
I prefer Vanilla CSS. It is easier to read, easier to write, WAY easier to maintain. more flexible, and wont be obsolete in 5 to 10 years. It does, however, require you to know what you are doing when it comes to CSS, which unfortunately is where 90% of front-end dev drop the ball
Well... Float was mainstream ~decade ago, because CSS is moving quite fast
And utility classes (core of tailwind) is as old as CSS itself
Same as to guy before:
Tailwind is based on CSS. It's just faster. If you prefer clean code, you can use separated css files and just style with @apply directive. It works exactly same like classic class or id binding, but it's a lot faster.
You can also use classic CSS units. You dont write max-width: 720px, you write max-w-[720px] or max-w-[80vw] instead, right inside class attribute.
But you can freely use CSS and Tailwind together, if you writing, for example CSS animations. You are not limited to write only Tailwind or only CSS. You can even write both in the same file.
Tailwind CSS is a industry standart right now, it won't be deceased for very long time. Don't worry about that. 😀
@@Biglu193 twitter and youtube influencers is not real life. Tailwind is by no means an industry standard.
If people enjoy tailwind that's fine, to each their own. I find it harder to read, harder and slower to write, way harder to maintain. Using @apply is the same except you lose the "advantage" of colocation in the first place.
A middle ground I've found alright is to use ailwind, the utility css library, for...utilities, as in I'll use it if I only need a class or two, like a flex container, but if I need more I will use a real css selector and write real css since it's easier and more maintainable.
@@darialyphia
I think it is more than obvious from the offers of positions on the market what is the industry standard and what is not.
We don't need to talk about this at all. Many companies have projects built on outdated technologies and are desperate for people to maintain them. (I saw offers even on Delphi)
These people are not looking for a candidate's ability to work with preprocessors because they see the future in them, but because they have no choice.
But i got it. You like vanilla CSS, SASS, SCSS and enjoying it. There is nothing bad with it.
Beauty of the Tailwind CSS is, you can use both, CSS and Tailwind together, without any limits.
So i can't even understand, why people fighting, which solution is better, because it doesn't even matter. 🙂
It's like an argument between Context and Redux users, or AWS and GCP users, Prisma and Drizzle users....😀 Im posting some info about Tailwind, because a lot of people here don't even know, how it works. It's not your case of course. 🙂
for me, the answer is very simple: use and stick with the standards that are better for your team. Tailwind is a great library that makes more optimized results (both in terms of size, repetition, and unused code), I still prefer CSS/SASS, but saying that Tailwind is harder to maintain or anything like that is just bs, like anything else it has some learning curve, and in a lot of teams/projects it will improve the speed and maintainability for sure.
I'm from old school so I passed through out all the process from vanilla css, sass and all the architectures proposal end up with BEM as my favorite. It's just recent that I'm starting experimenting with this atomistic architecture framework of tailwind because of React where Sass lost sense or at least I don't find it too useful because of the way we use module css on each component.
i dont think it matters for me, but i definitely dont trust people to not do a monstruosity with vanilla css
Why not both?
I wish you did a small course on nativewind with react native. This would be amazing.
I tried. I really did try to give tailwind a fair shot. But I could not get myself to like it. It's very intuitive but I hate how my html looks. Even with the tailwind plugin, I have a hard time making sense of an element with lots of classes, mainly the ones with light/dark theme support and animations
I think tailwind is appealing and recommended for beginners. But for veterans who have CSS hardwired in their brains, it's a tough cookie. They will be more productive in CSS.
I would use tailwind just as a more compelling replacement for bootstrap. (mostly for responsiveness aspect)
Also, a big aspect of tailwind ,, it's standardization. Meaning people can leave and hop on projects easier. Since you don;t have to learn what the custom CSS classes do or where they are declared.
I'm wondering why we don't speak about middleground between both worlds.
I think Stylex from Meta could be a good way to get the best from both world.
What do you think about it ? Thinking out of the box of "Tailwind vs CSS", I'm curious to have opinions about it
Vanilla css is great for complex shared or common components. Tailwind for standardized styles like padding/margin values or short cuts for doing flex or bold. That being said, I was really hoping the style library pollen would take off that
I'd like a VSCode add-on that let's me write tailwind snippets into a native CSS file.
what is this sorcery? please tell me more
Once you use Vanilla CSS, then switch to Tailwind CSS, then switch back to Vanilla CSS, you never go back!
Here's why: You are probably writing CSS wrong and don't even realize it, then switching to Tailwind CSS provides you a huge amount of inspiration for how to organize and group object oriented styles... Then you apply that strategy/paradigm back to Vanilla CSS, your Vanilla CSS gets WAY better and even EASIER and FASTER and CLEANER than Tailwind.
Why not use both?
Learn CSS and start creating templates. Once you build up versions of various components, you are likely to have on hand examples of things which are close enough to what you are looking for so you might need to tweak it for the needed application. The more work you do the more samples you have to where the idea of needing a 3rd party tool doesn't really feel like a need. In short, be your own framework.
We must always distinguish what we do, production and prototyping are different concepts. We are certainly free to use both but obviously it would be better to use them in the right development context.
For me, vanilla CSS with the help of Open Props by Adam Argyle is the way to go
SASS is unbeatable dude.
You can use both, add Tailwind and custom css sheets for advanced features you wanna code! Best of both worlds!
Im using pure css and couldnt be happier. It has layers, variables, nesting and wont ever be outdated like tailwind. Also it doesnt force your devs to learn a DSL. When i try to write tailwind it takes me 10x longer to write and 100x longer to read/debug as i have to go through the docs each time.
I like the way of writing in Tailwind.
I don't like that I have to learn a new syntax to do what I already can do easly with css.
That's why I created my own css framework.
Me thinks that it you definetely should be good at CSS before allowing yourself to use tailwind, its always important to know HOW things work, will help with debugging later.
what people in the comments seem not to realize is that:
- tailwind is more oriented to help frameworks that have a templating engine. Meaning you have a component, be it reusable or functional, and you add tailwind on top to make it look nice, meaning a component approach
- when going the css, the design takes then main stage, functionality is added on top(mixed or as a secondary concern)
Also css naming is and is not standardized. If you mostly worked with design and did your research in regards to design that's nice and all but you are a designer. When you're a developer that needs to take many other things into account, splitting your attention and your mental capacity to also include css is not easy, because CSS has become very complex.
I am saying this as an actual fullstack dev that started on the front side of things and migrated more to back (maybe 30/70% split) and in the past years i did try to read what interacts with what and how this and that works but when you have too many technologies in your head some are a second taught.
Maybe vanilla CSS is better then tailwind
But definitely tailwind is better when CSS-in-JS, css modules ect.
When will you do a course on tailwind css ?
It's too easy for a separate course. Trust me. 😀Take CSS3 course instead. If you know a CSS, you know also Tailwind. Go to Tailwind CSS docs and after a hour and half, you will be able to use it. If you dont know CSS, learn it first. You can't understand Tailwind without understanding CSS.
I see similarities between jQuery and TailwindCSS. At some point (a long, long time ago), jQuery was everything for me, until I realised I do not need it at all and can do all and more with VanillaJS. The same goes with TailwindCSS-handy, easy to copy and paste, and no need to learn CSS. However, I'm not sure why I would use it if I know and love CSS. I like clean HTML and structure, and it is easy to adjust to whatever crazy requirements I might get from the client. I don't want to be boxed and adjust crazy configs just to get another plugin to work for Tailwind.
well, we all used jQuery at that time because vanilla JS lacked simple things like css class selectors. there was no such things like querySelector in 2014.
"you dont have to learn css" is the least interesting feature of tailwindcss. if true at all. This argument in combination with "readable code" is for me just an indicator that author is mostly designer and/or not maintaining older projects (especially not the ones from other people in the team).
Vanilla css readibilty depends heavily on the author, so if youre not the one writing it, often is a headache.
@@MirkoVukusic On a contrary, I like to "dive in" in old CSS code base and re-write inside out. The "you don't have to learn CSS" came after observation on how Tailwind guys use it. Tailwind is great and probably all depends on use cases. I simply prefer clean HTML and corresponding CSS in agreed methodology, be it CUBE, or any other approach. Maybe I really don't get the Tailwind and maybe I need to dive deeper then couple prototypes but the maintenance of class soup is not my "plate" :)
@@andrisshvarcs , I like it too. I love "clean" and "optimized". I guess that comes wit being passionate programmer. But on hobby projects. When it comes to work, especially on the team, I just cant rewrite project css every time I want. And I'm loosing time massively on searching css files... on naming classes (people underestimate this!), not to mention media queries, simple animations, etc. Also, I'm not much of a designer nor I like doing it too much. I spend hours just on padding stuff which kills my programming focus. People underestimate tailwind's design standard.
So yes... don't give up on it. It takes time to get all aspects of it. I hated it. Took me 3 projects to get it. But this video is great... we should never just "forget" vanilla to be good at either.
@@MirkoVukusic@MirkoVukusic Somehow, I believe I will get the Tailwind project sooner rather than later; it is inevitable. :) I definitely try to keep an open mind and once the opportunity comes I will dive into it for sure.
I mostly prefer the vanilla css, but I found tailwind as most efficient way to work. Sometimes it is difficult to customise the tailwind so I prefer both option.
theres only one huge factor where tailwind really shines: speed of development (once one learn the utility classes names). yeah, there's the 'readability' and 'ugliness' factor... you can use Tailwind Fold extension for VScode if that really bothers you.... but does not bother me when working on a based component system like react, vue, svelte, etc. thats my conclusion after 15 years of front end development. i used to write a lot of plain vanilla css, and also used a lot the most popular frameworks / libs of the past like bootstrap, foundation, etc.
on the down side, i found when in dev mode compiling times using tailwind on mid size nextjs projects can become really slow.
but for beginners, here's my humble advice: learn plain css before tailwind css. one should learn the fundamentals of css before using any css lib or framework.
You should give Vite a try, it really cuts down on the compile times and makes front-end development a breeze with instant updates.
@@fred.flintstone4099 i use vite with 'vanilla' react for SPA projects. but nextjs uses turbopack.
@@fred.flintstone4099 nextjs uses turbopack. vite is fine for react spa projects
@@fred.flintstone4099 nextjs uses webpack / turbopack, not vite
Love vanilla CSS but Tailwind & Shadcn UI is just so productive
Vanilla CSS is very powerful and that's its biggest disadvantage. Features like inheritance look great theoretically, but it introduces complexity and issues, especially if it isn't your codebase.
I learned TailwindCSS because I was curious but I prefer Vanilla CSS. I think TailwindCSS makes sense when multiple developers are working on a large project, but otherwise, I don’t see any advantage. I have to say, though, that the documentation of TailwindCSS is good.
If you are on a large team - tailwind is fine. You'll want the consistency.
If you want to win awards, not look like everyone else, and work in very small groups, - vanilla. We don't need these frameworks. They just get in the way.
Get good at Grid, and Flexbox. Experiment.
These frameworks became popular when companies started leaning into "full stack" developers. They LOVE this stuff, but they are busy, so they can't spend their time on actually learning CSS properly.
If you're whining about tw, it's probably bc you're raw dogging it inline. Use it with scss and component classes. That's what we do on real projects. I know, the docs don't really tell you that.
Vanilla CSS is perfect. Tailwind allows you shortcuts to writing too much code. I use them both interchangeably. For example you have repeating elements that you suddenly decide to add a bunch of css rules it's quicker to make a vanilla css custom class than add all those classes to each element. Then you only need to give them one class and you're done. Need to change them in the future? Just go to your css file and change ONE class instead of going to each repeating element and removing what no longer fits there. On the other hand tailwind allows me to be lazy and slap a quick class on an element the right way instead of doing it inline. Both technologies have their uses, I'm not an absolutist here
If you're using a framework there nothing stopping you from extracting the repeating elements to a component so you don't have to change it in multiple places. It's all preferences my dude.
... but you have to *find* that class first. Sometimes years later. Then you have to find out if its used elsewhere and how the change will affect those. If youre not working alone, all this you need to do in someone else's code. You make it sound so easy, but its not in practice. Btw you can do the same in Tailwind, easily, but its dicouraged , tor the good reason.
Bototm line, use components for repeating items. Has nothing to do with css, its just reall good practice. if ots really samll one and you dont feel like it... you can target children styles from parent element in tailwind, just like in vanilla css.
No i don't wanna deal with media queries anymore
can i use tailwind without react or it is requirements for react projects?
You can use it anywhere you want. Static sites, React, Node, Laravel, Vue, Svelte, Angular, just everywhere.... You can use it via CDN in a single HTML file, if you want. 😀
@Biglu193 damn its been a long time. i really want to be a web developer now im just a delivery driver so my brain is a little bit rusty i hope i can still get it
@@healthadvice3091 So...send your white van into the river and get start with Laravel. 😀 ( It's easiest way to start with webdev these times )
i feel like i don't have control over my css when using a library ,so i just use css even with js frameworks
Iteration argument:
- inline styles
Flexible:
- it cannot be more flexible than css (tailwind IS ultimately css so .. DUH!!)
- it is NOT easier to start with than css considering it has more classes than css has properties
Also, inline styles are not considered to be a good practice because of the reusable fallacy. A decent software engineer can figure out what should or should not be reused and can pivot his decisions in favor of reducing complexity. And by reducing complexity I mean 4-5 indirections.
The code in the industry today is not unheard of to have a 10 to 15 long indirection chains that can be substituted with 3 lines of code. 10 years ago, building a complex solution was measured in months while nowadays it is measured in decades. 10 years ago those solutions took 5 figures to maintain, now it is 7 to 8 figures.
There are 2 types of software professionals, those who have no idea what they are talking about, and those who know that they don't have an idea what they are talking about. You are in the process of becoming the 2nd. Cheers!
If I use vanilla, I end up creating my own tailwind but buggy and wrong 😅
css is amazing and tailwind is the best way to write css in teams. vanilla css code gets hard to maintain real fast.
I use unoCSS instead of tailwind 😊
Fortunately tailwind don't vendor lock us
We can just write tailwind and when pure CSS make more sense we can just use it
Additionally because we don't create many classes, we can think less about conflicted names
Learning Vanilla CSS is important to learning Tailwind CSS. I don't think you made this clear in your video.
time to use vanilla Js too 😢
With Tailwind you don't just commit to a methodology, but to an entire opinionated ecosystem with its own configs, compiler etc. Since I'm mostly working on big products with a very long runtime (8-12 years), Tailwind is simply not an option. Having worked with (now) legacy JS and CSS frameworks over the past 12 years, avoiding dependencies on ecosystems like that is my biggest lesson. Any new add-on that you decide to depend on for short term gain will potentially hit back at you in years to come. The adaptation of new CSS features by browser vendors nowadays a pretty good, and I already said farewell to my once beloved SASS. But Tailwind will probably be much harder to get rid off if you ever decide to. For short term projects (1-3 years), Tailwind is probably a safe choice. For anything longer, stick to vanilla and web standards as much as possible. Thank me later. :)
I use Tailwind in all my projects, but I am tired of every component library out there looking the same because they all use Tailwind.
If you are beginner then NOT USE library like Tailwind/Bootstrap/etc. 😆
It’s a matter of time before AI will replace such content and I hope so , it will!
Nice!
tailwind is just delaying the inevitable adoption of modern css
Tailwind is an abomination of an extreme end of what happens when someone refuse to follow the standards and want's to reinvent whatever just for the sake of it. You want more then css can do out of the box ? Sure make it compile time with sass and call it a day. Everybody in their right minds came to the conclusion that inlining css into templates is a bad practice that is counter productive and then years after that some dudes that pretend to know better try to push inlinining css under the cover of shorter aliases in a class instead of style, nice job. Wanna write css fast ? Use emmet. Wanna do it with superpowers ? Use sass.
Tailwind and Vanilla CSS 👍
Tailwind is useful just for fast-prototyper developers. Once you need to write a project which has to last 10+ years Tailwind is a pure bloatware.
Tailwind is like smoking: it stinks and you should never start.
Tailwind css or nothing, why wasting your time writing vanilla CSS? specifically in big project. Those who are saying Vanilla CSS is better for readability don't know how to use tailwidcss.
Tailwind is trash
It's just trash
@@SuperninjaX2 Because you don't know how to use it
Tailwind makes CSS EASY
❤
Vanilla for fun. Tailwind for speed.
Oh, SM7B, you are so beautiful :(
Vanilla css gives you much better control than tailwind
Web components make Tailwind completely unnecessary and an inefficient developer experience by comparison. With shadow dom encapsulation you can just style elements directly. Soooo much better than having to add a bunch of classes.
VanillaCSS? I've never heard of that library
It's just the native CSS.
@@EthioMix wait..no way!
BEM with vanilla CSS > Tailwind
It's bizarre witnessing developers who are 1000x smarter than me, incapable or too lazy to use a pre-processor instead of CSS frameworks that bloat up HTML so they can be more "productive" (and having every website and app look exactly the same like a bot made it).
The wilder part is I'm viewed as a "lame" "boomer" because I semantically name ids/classes and apply the "framework" concepts used in a pre-processor behind the scenes which gives me the power to handle layouts and themes without touching the code that generated the HTML. It's like watching the hypebeast Macromedia Flash era happen again 🤷♂🤣.
R.I.P. Jason Knight, now I understand why he was so frustrated with the web developer community.
Why is not touching the markup a positive? You make CSS Zen garden?
@@M-lt6kx Why is not having to touch the markup due to understanding the concept of semantic HTML, classes/ids and user-agents a negative? Yes, I make CSS Zen gardens, and can make zen gardens for non browser user-agents too. I'm a "lame" "dummy" who isn't a "web-app" hypebeast. 🤷♂
@@mrdmajor Tailwind doesn't prevent you from writing semantic markup and semantic class name conventions get more difficult as a codebase and its contributors grows. I'm not here to call you the names you keep calling yourself, how other devs choose to build their apps is up to them.
@@M-lt6kx is not semantic. It's bloated HTML to make developers productive specifically to one user-agent when the majority of them are not building Figma/Adobe level applications. The part that is bizarre, is narratives stating how defining what a thing IS with HTML classes, is so difficult as code base and contributors grow, meanwhile types, interfaces, structs, enums don't cause that issue... 🤷♂
@@mrdmajor your example gives me more info that class="special-box special-box--different". You hangups about user agents might be specific to you but as a dev lead on large scale projects across distributed teams tailwind has proven to be more maintainable than any CSS, BEM itcss alternative. But as I said, I dont really care what other people choose to use. Do what you enjoy
When will you be on bluesky? 🙂
nice channel, but this is a completely useless video imo, nothing new is said here
like of course some people should sometimes use vanilla css
feels like a video made just for the sake of publishing one more video
Css fundamentalist
Tailwind end of story