TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

The rise and fall of Bootstrap and how Tailwind became the go-to CSS framework

83 点作者 vanilla-almond大约 2 年前

26 条评论

rendall大约 2 年前
&gt; <i>Let’s take an example.</i><p>&gt; <i>This is how you write a card component with Bootstrap:</i><p><pre><code> &lt;div class=&quot;card&quot;...&gt; &lt;img src=&quot;...&quot; class=&quot;card-img-top&quot; alt=&quot;...&quot;&gt; &lt;div class=&quot;card-body&quot;&gt; &lt;h5 class=&quot;card-title&quot;&gt;Card title&lt;&#x2F;h5&gt; &lt;p class=&quot;card-text&quot;&gt; ... </code></pre> &gt; <i>This is how you write a card component with Tailwind:</i><p><pre><code> &lt;figure class=&quot;md:flex bg-slate-100 rounded-xl p-8 md:p-0 dark:bg-slate-800&quot;&gt; &lt;img class=&quot;w-24 h-24 md:w-48 md:h-auto md:rounded-none rounded-full mx-auto&quot; src=&quot;...&quot; ...&gt; &lt;div class=&quot;pt-6 md:p-8 text-center md:text-left space-y-4&quot;&gt; ... </code></pre> Let&#x27;s be honest. All other considerations aside this does not make the case for Tailwind
评论 #34764704 未加载
评论 #34766193 未加载
评论 #34764579 未加载
评论 #34765125 未加载
评论 #34765014 未加载
评论 #34764382 未加载
评论 #34764488 未加载
评论 #34764758 未加载
评论 #34764551 未加载
评论 #34766363 未加载
ryanackley大约 2 年前
I really dislike posts that attempt to present their opinion as a new sort of dogma. I argue that this is one of those because his intro specifically mentions teaching junior developers as a senior developer and code smells. Bootstrap and Tailwind have completely different strengths. I don&#x27;t really see them as in competition with each other.<p>His most valid point is how hard is to customize bootstrap theming options. The rest of his points are just a matter of taste.<p>Luckily, if you google for &quot;free bootstrap theme builder&quot;, there are several free sites that let you point and click your way to whatever fonts, colors, etc. you want in bootstrap then download a bootstrap.css file that is a drop-in replacement for the one that ships out of the box.
评论 #34763970 未加载
评论 #34764320 未加载
samwillis大约 2 年前
Comparing Bootstrap to Tailwind is comparing apples to oranges. They are both css &quot;frameworks&quot;, but bootstrap is also a completely pre-made optioned design system. You don&#x27;t really get that with Tailwind.<p>The point of bootstrap is to get something that&#x27;s 90% of what you want FAST. And it can easily be customised to build a design system for yourself. With tailwind you have more foundational design work to do up front.<p>Personally I like the direction Bootstrap going, introducing utility classes, however there is more to do. My main wish is that they embrace web components for the JS side so that they are js framework agnostic.<p>As with all these tools <i>you</i> should evaluate what&#x27;s best for you and your team.
评论 #34763619 未加载
评论 #34763791 未加载
评论 #34764154 未加载
评论 #34763568 未加载
ricardobeat大约 2 年前
Tailwind is such a terrible option to teach newcomers. It’s basically a vast CSS dialect, at this point it would be much more valuable to learn CSS itself.
评论 #34763753 未加载
评论 #34763584 未加载
评论 #34764735 未加载
评论 #34765183 未加载
评论 #34764573 未加载
TrueSlacker0大约 2 年前
That for example has to be the most complicated way I&#x27;ve ever seen to change the font on a bootstrap website. All you need to do is include the bootstrap library and then include your custom css file after. In your custom css file you override the font. No need to change it via sass. I don&#x27;t think this developer understands basic css overrides. As a side note I use bootstrap and have never messed with the sass section.<p>I chose bootstrap over tailwind for my personal projects purely because tailwind looks terrible to read. For example the card example they chose. Div class&quot;card&quot; vs figure class&quot;puke lots of classes I will easily forget&quot; .<p>I think these two frameworks are aimed at entirely different types of people with entirely different goals.
skilled大约 2 年前
Tailwind is far from being the go-to framework in templating&#x2F;themes and general CMS. It is for sure the go-to choice for teams and startups that can afford developers who specialize in app deployment, but other than that - Bootstrap is just fine and way more popular than Tailwind will ever be.
gloryjulio大约 2 年前
Bootstrap is like Rails&#x2F;Django and it&#x27;s not leaving anytime soon. This kind of clickbait should be banned on hn
评论 #34764297 未加载
duxup大约 2 年前
I like Bootstrap and I think the writer misinterprets what Bootstrap is for.<p>I use it because:<p>1. It looks nice and users are familiar with it &#x2F; it is a mature &#x2F; proven system.<p>2. It’s fast. Drop in the CSS and I’m done fussing with CSS for +90% of situations. On with building the app.
bdcravens大约 2 年前
There&#x27;s a disconnect between the title and the article.<p>The article ends with this conclusion: &quot;My impression is that Bootstrap is declining.&quot; The article is the author&#x27;s work with both, which is fine, but the title implies an industry trend, which isn&#x27;t really supported by the article.<p>The article could have done this by pointing to statistical trends. However, I don&#x27;t think the conclusion would then be supported. Just looking at NPM, they both are at their high points, suggesting it&#x27;s not even a matter of competing. (I think Bootstrap has a larger amount of non-npm downloads, so that&#x27;s not a perfect metric admittedly)<p><a href="https:&#x2F;&#x2F;npmtrends.com&#x2F;bootstrap-vs-tailwindcss" rel="nofollow">https:&#x2F;&#x2F;npmtrends.com&#x2F;bootstrap-vs-tailwindcss</a>
brushfoot大约 2 年前
I appreciate that Tailwind is a force multiplier for certain teams, but let&#x27;s not get carried away. There hasn&#x27;t been a &quot;fall&quot; of Bootstrap. It&#x27;s still very popular, widespread, and well understood. It&#x27;s still being chosen for new projects. It depends on the team&#x27;s needs. The article wavers between acknowledging that and only focusing on apps with dedicated designers:<p>&gt; Most of the time, you can tell easily if a website is running with Bootstrap or not, even if you’re not a seasoned developer. From my perspective, it doesn’t always sound like good news! Because when using it, websites tend to look the same.<p>Which is often fine for internal or B2B. For B2C, a unique look may be more important. Many apps are LOB, internal dashboards, B2B SaaS. Often customizing the brand colors is enough.<p>&gt; With Tailwind, however, you can add your custom styles to almost anything. Why is that so important, you ask? First, because it allows you to design the website how you want it, this is great, especially for designers!<p>I&#x27;d say it&#x27;s <i>mainly</i> great for designers, although there&#x27;ll be overlap with developers for certain use cases. With the kinds of projects I work on, I don&#x27;t generally find myself needing that. When I do, editing the CSS is easier than bringing in Tailwind.<p>&gt; Look at easy it is! I don’t need to write custom CSS or Sass code. I just need to call the right classes to be able to use it. It’s really, really simple and yet powerful!<p>This is a bit handwavy. It isn&#x27;t easier to use Tailwind vs. custom CSS per se. Do away with custom CSS and you&#x27;re now just writing custom Tailwind. That could be good or bad depending on your team and tooling.
city17大约 2 年前
I recently started using Tailwind and really enjoy how fast it makes building new UIs. However, I wonder how we&#x27;ll view this in the future, when people have to actually go back into older projects using Tailwind and look at the jungle of classnames.<p>At some point there can be so many classnames on different elements that you basically arrive back at the original problem of complex stylesheets where you don&#x27;t know what is affecting what.<p>Combine that with the fact that you need to have good knowledge to which CSS styles each classname refers, and I can see a lot of headaches down the line when someone has to fix the styles on a complex component.
jmull大约 2 年前
Meh to the article.<p>Bootstrap and tailwind aren&#x27;t really trying to do the same thing.<p>e.g.,...<p>One client wanted a dashboard for certain data... we chose a bootstrap template they liked and... we were <i>done</i> with many aspects of the visual design. The template looked good, was appropriate for the purpose, the client was happy, and development proceeded to the parts of the site they really needed to control.<p>Another client wanted a custom design for an outward facing site. Designers and the customer worked together, iterated a bunch, and came up with a design they all loved... I implemented it with tailwind... straightforward for me and the client and designers loved it because it looked just like the design they worked so hard on.<p>It would have been possible to use tailwind on the first site, but it would have taken longer, for no benefit to the client or project.<p>It would have been possible to use bootstrap on the second site, but it would have taken longer (to customize) and&#x2F;or would look more like bootstrap and less like the custom design in places where it just wasn&#x27;t worth the effort to customize it.
awb大约 2 年前
I don’t think we’ve reached a perfect CSS workflow yet.<p>Bootstrap requires learning a new set of class names.<p>Tailwind is like in-line styles with fewer characters.<p>With both you can create an exponential number of similar looking, yet unique styles. It makes editing easy, but there’s no consistency constraints.<p>I think the holy grail will be something that enforces consistency without memorizing a new, unique styling dialect.
gimliapp大约 2 年前
For anyone using Tailwind CSS, I would recommend Gimli Tailwind. It&#x27;s a Chrome DevTools extension enabling smart tools for Tailwind CSS developers.<p><a href="https:&#x2F;&#x2F;chrome.google.com&#x2F;webstore&#x2F;detail&#x2F;gimli-tailwind&#x2F;fojckembkmaoehhmkiomebhkcengcljl" rel="nofollow">https:&#x2F;&#x2F;chrome.google.com&#x2F;webstore&#x2F;detail&#x2F;gimli-tailwind&#x2F;foj...</a>
exabrial大约 2 年前
Bootstrap&#x27;s purpose is to make the default web pretty. Tailwind does not fit into that niche. Two different goals.<p>Though reading Tailwind&#x27;s website, people seem to think they&#x27;re fighting some holy war against Bootstrap.... absolutely bizarre.<p>And as another commenter pointed out, Tailwind is just as complex or more complex.
lampshades大约 2 年前
I started a new project a few days ago and, while initially wondering if I should pick up Tailwind, quickly decided to stick with Bootstrap. I&#x27;m not a designer, I hate writing front-end, I use Bootstrap for every project I create, so I see no reason to change.
whatever1大约 2 年前
Tailwinds + HTMX is the heaven of one-liners. Or hell, depending on the size of your team.
tlrobinson大约 2 年前
Tailwind and “utility first” CSS is nice, but IMHO using magic string class names isn’t as nice as typesafe ways of styling like styled-components, Styled System, and Shopify’s Restyle.<p>Full stack type safety, including styling, is where it’s at IMHO.<p>Maybe there’s other ways of making CSS typesafe and supporting editor autocomplete, but why bother using CSS if you’re not even really using the cascade or non-trivial selectors?
awinter-py大约 2 年前
tailwind card example is 3x as long<p>might as well just use styles directly?
评论 #34765507 未加载
评论 #34764368 未加载
eric-burel大约 2 年前
Rewrite Bootstrap as a Tailwind plugin, bring peace to the javascript and css ecosystem, get nobel prize
waylandsmithers大约 2 年前
My own personal opinion is that Tailwind just looks better. Bootstrap is great for developers who want something instantly nicer than unstyled HTML, but Tailwind is more production-worthy.
rendall大约 2 年前
&gt; <i>On the contrary, React documentation isn’t great. They didn’t explain how to write efficient tests for a long time. Even with Hooks, I don’t think they give enough information. Most of the time, when I speak to developers about React Hooks, they don’t understand how they work.</i><p>I&#x27;m not a huge React fan, but I cannot agree with this criticism. Its documentation is thorough and complete. It also introduced the frontend community to the idea of Functional Reactive Programming.
评论 #34764501 未加载
irrational大约 2 年前
I’ve never used Bootstrap (which seems amazing since I’ve been a professional web developer for more than 22 years), but from what I know of it, I don’t think it is the same kind of thing as Tailwind. Is it?
评论 #34764026 未加载
评论 #34764208 未加载
miragecraft大约 2 年前
Tailwind, by itself, is more of a DSL than a framework.
baguettefurnace大约 2 年前
confession: I still like to use jquery sometimes
hknmtt大约 2 年前
i always preferred foundation css. nowadays i work with quasar that uses its own grid. never heard of tailwind.