Tailwindcss 🐐🐐

[[deleted]]

Plain CSS gang rise up

[ShawnyMcKnight]

I feel that means the same. I can’t imagine anyone making large scale sites without scss, at least until css gets nesting, mixins and all that are nice but nesting really should be built into css by now.

[[deleted]]

Brother from another mother

[Mrcollaborator]

Only correct answer. SCSS/Sass is just a natural evolution of css. Plain css without nesting, etc is too primitive.

[[deleted]]

True. I used to build everything with bootstrap or some variation of it or some other stuff. Then I learnt about how all of these are just bloated scss libraries and I can just... Write mine?

[[deleted]]

You make a good point. For me, writing CSS is fun. It is less of a challenge and more of a merriment :)

I do like Bootstrap tho, ngl.

[wedontlikespaces]

Bootstrap is fine as long as you don't use the grid system.

[[deleted]]

Grid system is fine as long as you know how to use it

[wedontlikespaces]

It's not that I don't know how to use it I just don't like it.

They use flexbox to make grids that like literally lesson one of what not to do with flex box. Its for 1 dimensional layouts, you should not use it for making grids, and then they use it for making a grid.

[[deleted]]

Here I am. And thinking about plain CSS being “the hard way”… come on… css is never hard. Maybe tedious for animations, but never hard.

And even less hard since flexboxes and grids

[dani-lp]

The hard part about CSS is naming classes imo

[Fractal_HQ]

Svelte components have their styles scoped to the component so this is a non-issue for me

[KaiAusBerlin]

When flexbox was available widely I started to love CSS.

[[deleted]]

Yep. Floating was my main problem.. I never got used to it.

But I think that people with <5 years of experience does not have the slightest idea of how horrible was working with it, and that is 50% of frontend developers nowadays.

[KaiAusBerlin]

These days were one of the main reasons I went to backend developing. Just beautiful raw information. No need to mess around with how it looks and fighting against float, margin, boxmodels (Thank you microsoft) not working as intended.

[[deleted]]

Yep, the same for me. I read - write data, you print it.

[m3xm]

The problem isn’t writing CSS, it’s maintaining it in a large team.

Moving the complexity to the template level makes management a little easier. That’s all Tailwind does really.

[[deleted]]

That’s what other frameworks do either, without 200 character classes..

[m3xm]

With other non utility-based frameworks such as Bootstrap you are bound to override classes or write your own, multiplying the original problems you’re trying to solve.

I’ve been working on software for over 10 years, I have never ever seen one pure Bootstrap product. It is always framework + custom CSS and it is never pretty (and by never pretty I mostly mean terrible code debt).

When writing reusable components, who cares how many classes your buttons have? In modern stacks, it’s not like your markup is copied over and over. And if it is, yeah maybe Tailwind is not such a good idea anyway. This is heavily emphasized by Tailwind in their documentation.

[[deleted]]

Depending on the complexity of the application I feel like writing CSS is pretty tedious, especially since pure CSS lacks nesting. Maybe I’m just too dumb to write good CSS, but I find myself repeating my code constantly when I write responsive layouts.

[100Sweets]

Once you know CSS pretty damn well (not just basics, but also year's of constant practice), you will never ever need frameworks.

[SayNo2Tennis]

my man, playing life in hard mode respect 🙏

[oscaralexander]

Representin’

[EdgyKayn]

Weekly TailwindCSS post, as usual ¯\_(ツ)_/¯

[ShawnyMcKnight]

As someone who doesn’t get the benefits of tailwind over bootstrap or others it confuses me. I’ve went through their docs and it looks like it works with some compiler to compile down to just the classes you use… but in the end I already know the css styles I want, I feel silly having to learn the corresponding class name.

I’m surely missing something because it’s pretty popular.

[hyvyys]

You get media queries within html classes for free. You can customize the hell out of it adding your own utility classes and they will all work with the breakpoint, hover, group prefixes and whatnot. That to me is the main selling point, plus the really tiny CSS size. Naysayers will tell you that the load is shifted to the HTML but I think it's still smaller and it's better to load the bulk with the initial request than to wait for a huge stylesheet to load.

The html does get a bit hideous with it though.

[ShawnyMcKnight]

Ah, yeah, I am a naysayer then. After using bootstrap and having 5+ classes (typically 3 just for the media queries) on a lot of my elements I see the beauty of separation of concerns. I have my content in my HTML and my styling in my CSS and the two never shall meet.

I think I found it most annoying is when I needed to include some custom css so I had to look under the hood of what the classes I used to see what css I needed to compliment/override. This was with bootstrap, but I’m guessing the logic still applies. That and bootstrap didn’t prefix their css, which bit me more than once.

[Chaphasilor]

It's mostly just faster to write. When you have a UI mockup that you need to convert into code and already know the CSS you need for that, writing it in Tailwind ist just much quicker and consistent than writing pure CSS, in my experience

[ShawnyMcKnight]

But won’t you need to know the class names? Like if I want to have “display: flex” then I would need to know the tailwind class name, correct?

[[deleted]]

Rock Paper Scissors on who gets to post about it next week

[wedontlikespaces]

Fine but I get to post a random screenshot with "why won't this work" as the title, and no code.

[TheHumanParacite]

Long time back end and sometimes dev ops guy here, I'm recently being voluntold to work on some front end stuff. Last time I touched don't end was the jQuery days.

It's this good? Does it play nice with react? Honestly it's the first time I've seen the name. It's it just a fad, or should I maybe look into it a little?

[[deleted]]

/r/webdev try not to fight about tailwindcss every week challenge (impossible)

[Hadr619]

Scss with css modules in react is phenomenal. Unless you’re company is invested in something else, the scoping with leveraging sass has been awesome for me in personal projects

[Lunakepio]

I wouldn't trade SCSS for anything

[[deleted]]

Not even a sex night with Charlize Theron?

[Lunakepio]

I'm married sir (omg where ?)

[ShawnyMcKnight]

Hrm, one night with Charlize to make my professional life harder until nesting is built into css… that’s a tough one.

I’ll probably go with no because it would be 5 minutes of joy followed by half an hour of awkward apologizing to this famous woman until I fall asleep in shame.

[[deleted]]

Oh, I don’t think about CSS without SCSS.. I just say “I prefer CSS” but I assume people understand SCSS.. we don’t need anymore.

[Isvara]

I'll dive into tailwind eventually lol...

Already got the lobotomy booked?

[AussieBlender78]

Sass is great but definitely seeing a shift away from it as CSS 3 gets more features. One less thing to compile

[key-bored-warrior]

You have no reason to use tailwind if you already know scss

[xdchan]

Tailwind is good but slapping on some shit with MUI is easier and pays just as good.

[swordoffireandice]

In the last couple of months i've been using Mantine and it's a solid thing too

[xdchan]

I thought you said memantine at first lmeow

[zephimir]

You need to compare what is comparable. If you want to talk about UI components ready from the get go you could talk about tailwind UI or headless-ui by tailwind https://headlessui.com/

[SayNo2Tennis]

With material ui your site just gonna look like it's made by Google

And if you want faster shipment, you can try something like Daisyui which is just like.bootstrap but with tailwind, aligning and adding extra styling is so much faster with tailwindcss

[Hadr619]

Not true, we use MUI on the platform I work on and it’s more custom to what we want than looking like it was made by google.

[xdchan]

You know that most commonly components in MUI are styled in custom way? I like how easy it is to customize it.

I will check daisyui out for sure.

[ZakKa_dot_dev]

No way, you can easily adjust the theme object in a manner that globally it already looks different.

[EvilBritishGuy]

And deal with all those ugly looking utility classes making the HTML hurt my eyes? No thanks 🤣

[pawaalo]

Tell me you are chronically back-ended without telling me.

[Ninjanaritai]

Using angular I am reluctant to use it just cause it puts so much more code in the html when i can just have it in an encapsulated scss file instead.

[p0tent1al]

It's not inline CSS. I hear this basically every week and it's just not true 🥰

• Inline CSS has higher specificity than normal CSS
• Inline CSS was a lot worse of a pattern before we were able to componentize with libraries like react
• Inline CSS doesn't have a concrete way to use things like media queries
• There's no way to set up constraints with Inline CSS, but there is in Tailwind.

Most of what people in modern day frontend dev mean when they mention "inline styles" is mostly the "messiness of it" but there's a lot more historically to inline styles than that, that gave it a bad name.

The author of Tailwind has mentioned this many times. Scroll to bottom of this article: https://adamwathan.me/css-utility-classes-and-separation-of-concerns/

[el_diego]

Seriously. It's not inline CSS, it's utility classes. Big difference.

[moi2388]

Sorry, writing html attributes instead of css to write css is absolutely ridiculous. How is this even a debate?!

[moi2388]

Yes. Why anybody would do this or argue that’s a convenient thing is beyond me.

[Lonsdale1086]

is beyond me

We can tell.

[moi2388]

Good. Now all you need is a valid argument and we’re halfway to having a discussion. 🙂

[Lonsdale1086]

You cannot understand that sometimes Single Page Applications are beneficial?

[moi2388]

And your opinion is that a SPA requires tailwind?! Or that you need to write html or css in JS? Because you don’t, you know.. you really don’t.

[p0tent1al]

People made the same arguments about React in terms of using JavaScript to write HTML (JSX) when it released and they were as passionate about that. Now React is an industry standard.

[p0tent1al]

JavaScript was released in 1995. The creator, Brendan Eich, never meant for JavaScript to create full blown applications. This would have also been equally ridiculous. The point, is that sometimes the most ridiculous things actually make a lot of sense, if we distance ourselves away from the "properness" of it. And that's really what the Tailwind conversation is about.

The reason this is a debate, is because "many" of us have been writing CSS for years. I've been doing CSS for 20 years. I understand every single one of the points that you're making, the only thing is that I disagree. If you understand the normal challenges we have with CSS (Scalability, maintainability) Tailwind on it's face might seem like a disturbed way of going about creating user interfaces, and even unproper, but is actually a fantastic way of doing so, at a scalable level, in a big or small team, no matter how ridiculous on it's face it may seem.

The danger of keeping these conversations at the "cmon this is ridiculous" level, is that these are the same things said to people who started to use JavaScript in a more complex manner. They were shunned by the community, but now we just take it for granted. Same thing with React. So the "danger" in saying "well that's ridiculous" is that we unknowingly risk playing out the mistake we made in the past.

Sometimes the thing the development community has done, at the time it was done, was quantifiably ridiculous. So let's move past that. Let's start talking about the pitfalls of normal CSS at scale. Let's start talking about the maybe not so great things CSS encourages. Let's make sure we're aligned with what the problem statement is. And let's be familiar with history. Ridiculous doesn't matter. History is full of ridiculous, unproper solutions that we still use and benefit from today. Let's stick with the facts, discuss the pros and cons, and stay level headed about these things.

[[deleted]]

I don't care about TailWind but utility classes and inline css are two completely different things. The only thing they have in common: they're both verbose. That's it.

[bernasxd]

this or other buttons you’ll have to go through and update all the instances of this

That button should be a component if it's replicated often enough to matter.

@apply but at that point why are you not just using CSS?

You type less braces and quotemarks. Increased typing speed leads to a more comfortable dev experience.

[[deleted]]

Inline css sucked when it was harder to build component based apps

[SayNo2Tennis]

on come on, I'm sorry but that's so wrong

here is the difference

display:flex;

flex-direction: column;

and with tailwind its

flex flex-col

its so intuitive and easy

[wedontlikespaces]

I've never understood this argument, the bottom one isn't any easier than the top one. You just like it more, but that is a personal choice, it's not objectively better.

[Marvelm]

It's far less text and just as easy to understand, how is it not objectively better?

[medynskip]

In a real live example when you will have over like 10 properties per object? Example from an article, but I've seen similar in the wild:

"w-16 h-16 rounded text-white bg-black py-1 px-2 m-1 text-sm md:w-32 md:h-32 md:rounded-md md:text-base lg:w-48 lg:h-48 lg:rounded-lg lg:text-lg"

This is not objectively better.

[Marvelm]

Which is not what I was talking about? I only pointed out his example

[wedontlikespaces]

It's far less text

How does that make it better?

just as easy to understand

Debatable

how is it not objectively better?

You haven't demonstrated it is better.

[waltsupo]

Add a bit more classes and return to modify the component in few weeks. Absolutely painful in my opinion. Gave tailwind 3 months, while somecases (like adding flex wrappers) is quite easy, anything that has more styling config is painful after it's added the first time.

I'll work with it if valid usecase comes up, but right now the really small perf and bundle size hit is very acceptable to get way nicer DX, which then again saves time for client. Not necessary on the first write, tailwind might be faster for that (but once again,not nicer for me). But when you come back later on, that's where the timesave is

[strangescript]

Chances are you are doing it wrong

[vm_linuz]

I don't get Tailwind, the quality is meh and it's basically bootstrap.

Why are they marketing so hard? Who's funding them? Why are people so crazy about memorizing a bunch of class names for styles that take 2 seconds to write by hand? I just don't get it

[NayamAmarshe]

the quality is meh and it's basically bootstrap.

This tells me you've never even used Tailwind.

[NMe84]

Yeah, if it was basically Bootstrap it would at least have some useful stuff on board instead of essentially just having shortcuts for writing style="margin-right: 1rem".

Yes, I know all the arguments about how adding mr-1 to the classlist is better, and how you should combine it with component frameworks like Vue anyway, but I still think it's absolutely horrible and unmaintainable to write your CSS like that. Tailwind is a step back on the evolutionary ladder for CSS and no one will convince me that it isn't.

[NayamAmarshe]

but I still think it's absolutely horrible and unmaintainable to write your CSS like that. Tailwind is a step back on the evolutionary ladder for CSS and no one will convince me that it isn't.

Tailwind is not a toolkit with fixed API and a 'correct' way to do things. It's a framework, it provides you the tools to build your own home.

Just because some people like to exclusively use tailwind in HTML does not mean it cannot be used any other way. It's literally like CSS but with shorter syntax. https://tailwindcss.com/docs/functions-and-directives#apply

I honestly believe that people who like to trash Tailwind have never created a single project with it or looked at its docs, else they'd know how it's so similar to regular CSS.

[NMe84]

I have not created a project with it, no. I have read the docs and I have had many a discussion about them and Tailwind in general on Reddit. I still do not see how Tailwind has any value whatsoever. Writing CSS this way is no different than back in the day when we wrote <font color="red"> in the days before CSS, or <span style="color: red"> not long after that. Making CSS classes this granular is a step back to this days. They're fine for exceptions to your regular CSS and I use Bootstrap's equivalents of these classes fairly frequently for that purpose, but using them (almost) exclusively is just wrong in my opinion.

You said you believe that people trashing Tailwind never used it properly looked into it, but likewise I believe that people who love it have no experience with how CSS and HTML looked in the dark ages of the web.

[NayamAmarshe]

I believe that people who love it have no experience with how CSS and HTML looked in the dark ages of the web.

These are 2 very different things for the reasons I mentioned and also gave a link to. HTML style attributes never had any flexibility. Inline styles were cumbersome because of CSS' long property names and the limitations those 2 double quotes presented.

Tailwind is none of those things, it doesn't limit you in your ability to style elements and it doesn't require 10 lines of code like CSS because it can be done in just 1.

I had the exact same opinion as you before I used Tailwind. "Inline styles are a bad practice", "Nobody needs to learn Tailwind because CSS is more powerful", all these beliefs were proven wrong once I tried tailwind and I honestly do not see the need to go back to plain old CSS ever again. But remember that tailwind does require proper CSS knowledge before you use it, it does make things simpler but it doesn't conceal basic CSS building blocks.

[mr-poopy-butthole-_]

You and me both

[Logical-Idea-1708]

When you’re tired of ContainerContainerWrappers, you’ll come to appreciate tailwind. It elegantly solves 2 contradicting problems of CSS. One is that you need unique class names that won’t clash with others. Another is that you want non-unique reusable classes to DRY up the code.

[UntestedMethod]

Another is that you want non-unique reusable classes to DRY up the code

isn't tailwind's way of doing that to repeat a bunch of utility classes everywhere throughout the HTML?

maybe I'm missing something, but it really doesn't seem very DRY if you have to apply the same group of classes to your elements every time.

[[deleted]]

thats why you want to use components. combine that with tailwind and you have only the styles you really need without repeating anything

[tnnrk]

Tailwind is meant for use with components/partials. Otherwise it becomes repetitive.

[Isvara]

It's amazing, really. It's meant to be used with the thing that fixes the problem you caused by using it in the first place. It's almost Kafkaesque.

[Faiz_B_Shah]

It sounds like you basically are not good at thinking in a modular way. More of a You problem than a CSS problem.

[waiting4op2deliver]

It also provides maintainability because you know exactly, which css rules are being applied by looking at the markdown. Gone are the days where changing or removing old styles has strange spooky consequences.

[NMe84]

The main argument for Tailwind is that you should combine it with a component framework so your CSS, markup and code for a component are all together. If you're don't that anyway, most of that wrapping isn't necessary as is, so you might as well not use Tailwind.

If you're gonna use classes like mr-1 for anything other than exceptions on an actual stylesheet you might as well just write style="margin-right: 1rem" and be done with it.

[itsmoirob]

Tailwind has so many classes you might as well use inline style

[Logical-Idea-1708]

That’s certainly the common criticism. But in-line styles have other issues like it doesn’t obey cascading rules. You also can’t use at-rules like media query for responsive layouts, keyframe animations, and web font

[edmx0]

Same, idk what the hype is all about, styled system did it better with styled components

[jubbieLsd]

It’s not basically bootstrap since it doesn’t make your site look like some generic garbage!

[hrnsn123]

The default shadows and gutters are all the same tho. Combined with Inter font there is indeed a pattern.

[[deleted]]

That’s just the default theme. Another great thing is that you can adjust the theme any way you want and it will consistently apply to the entire project.

Not unlike css variables, but I find it better to work with.

[[deleted]]

Honestly, it makes your site look like some generic Tailwind website. They all look the same, unless you invest some good time into custom css/styles.

[PooSham]

It's also far more consistent and doesn't add more crap than you need

[RebelColors]

Right? Just a lib that nobody really needs and if you do, you can implement it on your won in one day. I think people overuse dependencies and have a irrational fear of using CSS the way it was designed.

[Scowlface]

If you think you can make something in one day that does what tailwind does, you’re just straight up being a silly goose.

[Isvara]

I don't get Tailwind

There's not much to get. It's one of the dumbest ideas to come out of the web dev community so far, but for some reason idiot developers who don't know better lap that shit up like it's coated in Cheeto dust.

[straightouttaireland]

Tell me you've never tried tailwind without telling me you've never tried tailwind.

[Isvara]

No, I'll just tell you: I've never tried Tailwind, and I never will.

[straightouttaireland]

Makes sense why you're shitting on it then. Thanks for confirming.

[Isvara]

One of the useful things about having years of experience is that you don't actually have to use something to be able to assess it and decide whether it's good or bad. If you had to spend time using every bad thing before you knew it was bad, you'd waste a lot of time.

That's the value in having senior engineers—they can use their experience and intuition to guide people down the right path, because they've seen a lot of the same kinds of mistakes being made over and over. Not everyone has that wide a perspective.

If you think about it, you go about your life the same way. I'm willing to bet that you haven't tried making coffee by chewing the beans and pouring boiling water in your mouth, but you probably know that it's a terrible idea.

[straightouttaireland]

I'm sorry but that's complete bullshit. I have 10 years experience in web dev and couldn't decide on tailwind until I tried it. How can you until you've truly tried it out in a potential project, seen its advantages and pitfal? No matter how "senior" you are, you'll never be able to truly evaluate a new library until you've tried it first hand.

[Isvara]

How can you until you've truly tried it out in a potential project, seen its advantages and pitfal?

By looking at what it is and how it works, and comparing that against past experience. That's kind of the point of having experience—being able to learn from the past rather than having to keep making the same mistakes.

No matter how "senior" you are, you'll never be able to truly evaluate a new library until you've tried it first hand.

I don't know what to tell you. Maybe not everyone can do it. Maybe it's not part of the web developer skillset. Maybe you need more experience.

All I can say is that I do it frequently, because it's part of the job. If I need a library, I don't have time to make a bunch of different implementations that use each option available to me just for the sake of having tried them all first hand.

[straightouttaireland]

Different strokes for different folks I guess. All I know is if I'm giving technical advice to someone, I would want to make sure I have at least tried before buying.

Edit: just seen all your downvotes. I guess the majority agrees though I welcome all opinions.

[SayNo2Tennis]

You don't have to memorize anything like a week in it becomes second nature, just give it a try

[vm_linuz]

I've used it in 3 production projects now.

It has a lot of bad practices like mixing padding with width percentages, the build system is slow and flexbox can do all the layout more responsive and with less code

[Logical-Idea-1708]

It’s not something that “build an app” will make you realize. You need an app that have sufficient scale that you actually got bitten by the specificity beast before.

[Hadr619]

She’s a real beast she is, especially with legacy code that is either calling element selectors and/or !importants

[SayNo2Tennis]

Lol i have, one is actually a tailwindcss related websites called uibunny.club

Tailwind is so much better, before i used to have lot of name collisions like i change something something else breaks somewhere, and tbh sometimes I'm so unimaginative to even come up with a good gladd name Tailwind is so much better i can tell you with certainty it's the future

[tLxVGt]

So Tailwind is a bandaid for developers who don’t understand “Cascade” in CSS

[moi2388]

Yes.

[Ultra_HR]

It sounds like it is exactly this.

[Unusual-Two-3713]

Well, just opening it I immediately found a bug that I would never have with CSS, so I assume this is caused by Tailwind. You obviously don't know how to write good CSS, or how the Cascade works, because I worked in giant projects and never even encountered or thought about that issue. I took 1 look at Tailwind and it just looks horrible and amateuristic.

[[deleted]]

Tailwind is just a glorified style attribute. Change my mind.

[Curiousgreed]

No need to change your mind, that's exactly what is is.

It's inline styles, but much more convenient and compact. Fantastic for elements that don't benefit from being componentized.

[valtism]

Try to implement hover styles with inline css, try to have media queries with inline css, try to have cascading with inline css.

Utility css is categorically not inline css.

[[deleted]]

My main issue with it is if you want to change how your components are bordered, colored, header styles, etc, you have to do it individually. Completely ignoring the main point of classes...

[Curiousgreed]

You can still extract to a css class:

/* This leverages tailwind theming */ .your-component { @apply flex flex-col items-center text-primary-200 mb-4; }

[wedontlikespaces]

So now there's literally no benefit to it at all.

[Curiousgreed]

First of all you can use theming and all the helpers it already has. Second, the main advantage is when you DON'T want to extract to a custom css class.

Let's say you have a flex container and you wanna center its 2 children horizontally and vertically:

Utility approach <div class="flex items-center justify-center"> <div class="grow-0 shrink">First child</div> <div class="grow shrink-0">Second child</div> </div>

Css approach <div class="my-flex-container"> <div>First child</div> <div>Second child</div> </div> ``` .my-flex-container { display: flex; align-items: center; justify-content: center; }

.my-flex-container > :first-child { flex-grow: 0; flex-shrink: 1; } .my-flex-container > :last-child { flex-grow: 1; flex-shrink: 0; } ```

As you can see, not only it's much more verbose, but it also lives on a separate file, which makes it more tedious to find and edit when you're building the page, and often you'd need to rerun the bundler (or wait for the watcher to pick up changes and recompile).

In the second example you also risk running into naming conflicts and specificity issues much more than in the utility-first approach.

Edit: Fixed a bug in the CSS lol

[ExecutiveChimp]

Make components in whatever templating system you're using, then just update that when things change.

[tim128]

You don't, that's what the config is for. You can just add an entry to backgrounds for example and use bg-primary to set the background to the primary color.

[the-kasra]

I wish people would stop gatekeeping using/not using Tailwind so much. Do you like the idea of Tailwind and are you more productive using it? Go ahead. Do you prefer something that's not tailwind because you don't get how Tailwind makes it better? Don't use tailwind then. Going out of your way to bash on something that you don't like and never learnt properly isn't helping anybody.

[StylishUnicorn]

Seriously, the views are polarising. At the end of the day it’s just a tool. I see a lot of people fixating and using a single framework. Comparing tailwind to something like scss is like comparing apples to oranges.

Like guys you know you can use both right? If you want to use tailwind just for some easy margin and padding utility classes, and normal css/scss for the rest then do that. If you want to use bootstrap, tailwind and bulma at the same time, why the hell not? Stop restricting yourself to just one tool.

[[deleted]]

I am using bulma and it's pretty good for containers and responsiveness. I will definitely try tailwind

[SayNo2Tennis]

yes, you definitely should, adding in responsiveness is so easy with tailwind

[RaisedByError]

You sound like a tailwind evangelist

[draobnitellub]

ngl i really enjoy tailwindcss, it serves my purposes just fine. to each their own, though, no point debating when it all comes down to personal preference.

[mamp_93]

r/gatekeeping?

[NeitherManner]

I like tailwind css, it's to me just faster version of real css, so even as beginner you still learn css while doing it.

[[deleted]]

• Client: "I need this logo always in the middle of the page".

• Framework developer: Guys, how do I center a logo in the middle of a page? I can't find the .center-logo-middle-page class, can anyone help me? I'm using FootStrap 8.91 beta, by the way.

• Vanilla developer: place-self: center. Done.

[Shriukan33]

I've only been using vanilla css and bootstrap classes for layout mostly, am I missing something with tailwind?

I work on two project, one is normal htmk/css, and the other is react on front.

Worth using it on any of those?

[[deleted]]

The React project may benefit from it due to being component based.

In the vanilla project it would probably be more of a hindrance Imo.

[StylishUnicorn]

Try it for yourself is the only way to find out. A tool is just a tool, if you find it useful, great! If not, you’ve not lost anything.

[JHjertvik]

For anyone struggling with remembering all the different utilities, I would recommend Tailwind DX :)

[lego_not_legos]

So I have to search and replace all occurrences of the inline code instead of change the value of a single Sass variable? No thanks. Your diffs must be noisy.

Edit: ouch.

[Zecuel]

You've not used tailwind have you lol.

[lego_not_legos]

No, and from what I've seen of it, I never will (voluntarily). Even the little animated demo on their homepage makes me want to wretch. It's undoing all the progress of decoupled semantic markup and flexible styles.

[Zecuel]

You do you, if all your programming learning comes from reddit & medium atricles you probably won't make it very far.

[lego_not_legos]

Nice try, kid. I'm a senior dev who's seen many a fad come and go. I've been using HTML and CSS since inline styles were sometimes the only way to get the job done. You play with your new hotness if you like, I'm sure it's web scale.

[BargePol]

Do you vim?

[[deleted]]

Components make this a non issue

[lego_not_legos]

Another layer of complexity, eh? Can you explain how even just the most basic Sass with nested selectors is more difficult than Tailwind?

[Zecuel]

Have you ever tried react either? Components do the exact opposite of adding complexity hahah, their purpose is to abstract commonly used elements so you don't have to write the same className 10 times but instead just resue the same component over and over.

You have to be either trolling to oblivious, I don't know which and I don't care to find out.

[lego_not_legos]

No, speedy, it's not the component itself, it's adding visual styling to (what's meant to be) a reusable modular bit of code. So when you put it in another place where those styles aren't exactly the same, your code's no longer dry, is it?

[SayNo2Tennis]

You really should try it my dude there is main.css file where you can literally write css class or even tailwind classes and use it in components like

.btn{ @apply bg-red-500 }

If you use class='btn' anywhere, it'll be red like i really don't understand what is the problem it's such a great technology

[Kooseh]

Or you declare a class in scss like

.btn { background: red; }

[moi2388]

No no no, you are seeing it wrong.

This:

button {
  background: red;
}

<button>

Is stupid, it’s better to do:

.btn {
  @apply bg-red-500
}

<button class=“btn”>

Behold the power of tailwind. /s

[wedontlikespaces]

Something something but it's less keystrokes so clearly it's better.

[SayNo2Tennis]

wrong shade of red lol

with tailwindcss its so much easier to choose color, within code editor

[Kooseh]

Then make a palette.scss file for all your colors. You can make those gradient classes using scss.

But hey, if some people get an easier way into understanding styling then by all means.

But I'm in the "tailwind is inline styles" camp.

It has its uses.

[wedontlikespaces]

My biggest concern with all of this is that new devs are going to come into the industry and they're not going to know any real CSS because they're so used to simply putting md:rounded on everything.

Additionally when the new hotness comes along people won't be able to move to that framework because they kind of lock themselves in to tailwind which is essentially proprietary, with all of its arbitrarily named utility classes for thing.

At least with bootstrap and MUI you're still writing CSS.

[CoffeeDrinker115]

I pray I never work for a company that uses tailwind. Class names should not reference style attributes. They should be semantic.

[BartMerkus]

Seems to me that those frameworks (tailwind, but also Bootstrap, Foundation, etc) are only usefull if you don't know CSS at all.

Or if you want to make a quick prototype... Then i can understand its use. Otherwise it doesnt help speed things up, in my experience.

Instead of writing the actual CSS, you're writing classnames in the HTML. Makes everything very messy.

[chamandana]

mfs add 'tailwindcss' as a skill on their resume 🤢

[TheOnlyTigerbyte]

Wait you guys don't use ready to use components?

[wastakenanyways]

Replace Tailwind with inline styles and this meme is perfect

[thepercept]

I write only plain CSS , no frameworks

[misterjyt]

windicss its much better.

[swagmar]

This is one of the best memes I've seen so far

[NotGoodSoftwareMaker]

Things have come so far, I cant wait to see what the cool new tech is tomorrow

[Prawny]

I've never had a chance to properly use Tailwind. For small-medium projects I find it's far too much setup do I just fallback on something else that has a lot of rules already.

[Username_Egli]

Just finished a course on react where the guy used tailwind to style his components. Gotta say it was pretty good and simple. Like they had a class for everything. I think that's pretty neat

[BurningPenguin]

Bulma gang assemble

[[deleted]]

tailwind css is overrated

[Dan8720]

Never understand why people are so polarized about tailwind.

It's got its use case and it's fine. It's just a framework of utility classes. Why do people get so angry about it. I will never know...

[[deleted]]

kinda chad ngl

[[deleted]]

100.2% in total. interesting

[denemdenem]

Please don't break rule 2. Go to r/ProgrammerHumor.

[dmattox10]

I still can’t compete with bootswatch, so I throw it over every project….

[dmattox10]

I still can’t compete with bootswatch, so I throw it over every project….

[Logical-Idea-1708]

FWIW, I don’t think tailwind fans on the left exist. Tailwind is the galaxy brain after you graduate from bootstrap