刚入职新公司，老板就给了我一个“惊喜”任务：

老板“需要根据现有后台系统，Zuo个新的后台系统，好kan点、大气点、不要太模板化，对了用 React。” 我“？？？没有 UI、没有产品。我尼玛* *”

代码是老板不知道从哪里弄来的压缩包。如上所示，“屎山”把我压得喘不过气。我有时候真想找到之前写这个代码的人骂一顿。这个代码存在的唯一价值就是主流程Neng跑，或许这就是小公司老板所关心的吧。

上图的 UI，我dou有微调过包括字体、图标、间距等等，让它kan起来不那么“模板化”。奈何有天老板从我旁边过kan了一眼说：“你是用的 Antd 吗？Neng不Neng搞得不那么模板化，kan着还是太大众了。”当时我内心真的想骂人，辛辛苦苦Zuo的工作就这样被一句话否定了而且又没 UI、又没产品。

由于没有设计师，我只Neng凭借我的审美去调整一些 UI 细节，比如配色、字体、间距、图标等等。总之就是尽量让它kan起来不那么像一个模板系统。初版如下图：

但是由于我知道 TailwindCSS 的流行趋势，且确实 shadcn/ui 的可定制化geng高一点，所以还是决定用 shadcn/ui 来重构。但是时间紧、任务重，我想从网上找找有没有现成的Ke以二开的 shadcn 后台模板。结果发现了这个项目：shadcn-admin。里面封装好了 Table、Layout 等功Neng且支持移动端。推荐给各位，太香啦！

没办法，谁让人家是老板，还是照Zuo。我在网上有kan到过 shadcn/ui 这个组件库的，它是基于 TailwindCSS，我本人是非常厌恶这个玩意的：

bootstrap和tailwind 区别:.样式修改不用加!important、不用 hack CSS 变量. !-- tailwind css 按钮 -- button class= bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded 按钮 /button .

# 安装核心依赖npm install -D tailwindcss postcss autoprefixer# 生成配置文件npx tailwindcssinit-p.修改tailwind.config.js,指定需要扫描的文件:.

用了Tailwind后体验感挺复杂的,刚开始觉得方便又高效,但随着项目推进却发现维护起来有点吃力。不过它确实Neng提升开发效率,尤其适合样式复用多的小模块 风hen大的tailwind真的好用吗? 前端格格 微信公众号 查kan原文 AI小值了该内容 2025-06-25 12:05:04 Tailwind是一个流行的原子类CSS框架,它通过预定义的类名减少自定义CSS的需求,提高开发效率。其优点包括减少模板切换成本、大量复用和减少体积、自带响应式和深浅色主题支持。然而,它也有缺点,如学习成本高、类名繁多不易维护、修改成本高。尽管有人对Tailwind持批评态度,但大多数使用过的人对其持正面评价。...

tailwindcss v2 vs v3.举报举报sveltekit-tailwindcss-prettier-template.

虽说是现成的模板，但是有一些功Neng没有、或者需要根据业务适配。比如国际化、Table 远程数据请求等。

Tailwind 还是挺香的，我觉得它是一把双刃剑。我的前同事确实给维护的人增加心智负担，但是也Ke以通过一些技术手段改善和优化。这取决于用它的人是怎样的。

tailwindCSS为何争议大且爆火 聊的优点展开了,时间大致如下.万物研究所程序员编程tailwindcss前端写代码的白玩发消息应无所住,而生其心.

由于我之前搭建的 React 后台模板Yi经比较完善了所以我直接拿来用。然后一步步把旧版系统的功Neng搬过来并且升级了一些依赖版本等等。老板要求的一个重点是不要太“模板化”，我一直思考应该怎么样去处理和优化。

因为上一家公司有个同事在项目里使用TailwindCSS,满屏的 classname,kan得我头皮发麻。想要改一个样式dou不知道从哪下手 shadcn/ui 和我认知里的 Antd Pro 是完全不同的设计体系。比如在 Antd Pro 里写一个表格,请求接口拿到数据喂给 Table 就行了。但是在 shadcn/ui 里你得自己写分页、排序、筛选这些功Neng。你得自己实现hen多功Neng,会导致我的工作量大增。虽然现在dou用 AI 编码了,但是我还是觉得hen麻烦 但是由于我知道 TailwindCSS 的流行趋势,且确实 shadcn/ui 的可定制化geng高一点,所以还是决定用 shadcn/ui 来重构。但是时间紧、任务重,我想从网上找找有没有现成的Ke以二...

这一套新兴模板，上手还是有点难度的。TanStack 体系庞大，shadcn 定制化高。但是目前 AI 盛行，资料也是大把，相信对你来说也dou是小菜一碟。

在中后台业务中,Tailwind CSS 常因以下原因不被推荐: 代码可读性差:HTML 中堆砌大量原子类,业务逻辑被样式代码淹没,维护困难 。 与组件库冲突:中后台常用 Ant Design、Element Plus 等重型组件库,Tailwind 的全局重置易破坏组件默认样式,导致样式打架 。 维护成本高:动态拼接类名增加调试难度,后期修改样式需全局搜索替换,违背关注点分离原则 。 团队适配难:新手需记忆大量类名,多人协作易出现样式不统一,反而降低开发效率 。 对于业务逻辑复杂、需长期维护的中后台系统,传统 CSS Modules 或 SCSS 方案往往geng稳妥 。 Zuo中后台业务,为什么我...

没有 UI、产品，我真的是一头雾水，不知道该如何下手。只Neng先把旧版系统的功Neng理清楚，然后一步步实现。因为老板要求用 React，正好我之前用 React 自己搭建了一套后台管理模板，它是基于 Ant Design 的一套系统，有兴趣的Ke以去kankan。

旧版系统是 Vue3 + ant-design-vue Zuo的，一个巨大的“屎山”直接丢了过来。几个比较严重的问题：

不用 Tailwind，真香吗？

说实话，Tailwind 真的挺香的，但前提是你会用。

你要是不会用，那可就……

害，我之前有个项目，也是满屏的 class，kan着dou头晕。

不过呢，Tailwind 也不是不Neng用，关键kan你咋用。

你要是Neng封装好、组件化Zuo得到位，那它就是神器。

你要是乱写一通，那它就是灾难。

咱就是说工具本身没毛病，毛病出在人身上。

你不Neng指望一个框架帮你解决所有问题，对吧？

你得自己动脑子，不然谁也救不了你。

那为啥还有人说 Tailwind 不好？

其实吧，Tailwind Zui大的问题就是——太啰嗦了。

你写个按钮，class 一写就是一行半，kan着dou累。

而且，你要是想改个样式，那可就……

你得全局搜 class，改一个地方可Neng影响一堆东西。

这谁受得了？

但你要是会封装，那就不一样了。

你把基础组件封装好，比如 Button、Card、Input 这些，

然后你再用 Tailwind 写样式，那就轻松多了。

你懂的，代码复用才是王道。

那我为啥还推荐 shadcn/ui？

因为它基于 Tailwind，但又不全是 Tailwind。

它把hen多组件dou封装好了你直接用就行。

而且，它还支持自定义主题，你Ke以自己改配色、字体这些。

Zui重要的是它不模板化。

你老板不是说不要模板化吗？

那你用 shadcn/ui，绝对Neng让他满意。

你懂的，老板满意，你才Neng安心搬砖。

那怎么用 shadcn/ui？

你得会 React。

然后你得会 Tailwind。

再然后你得会 TypeScript。

Zui后你得会点设计。

你要是不会设计，那就多kankan别人怎么Zuo的。

你要是会设计，那就geng好了。

反正，你得动脑子。

你不Neng指望一个组件库帮你搞定一切。

你得自己动手，丰衣足食。

那我该不该用 Tailwind？

说实话，kan项目。

你要是Zuo中后台，那我建议你三思。

你要是Zuo官网、营销页、展示页这些，那 Tailwind 绝对香。

你要是团队里有新人，那我建议你先培训一下。

不然你写得再好，别人也kan不懂。

你懂的，团队协作才是关键。

Zui后说两句

工具嘛，就是用来解决问题的。

你要是Neng解决问题，那它就是好工具。

你要是解决不了问题，那它就是垃圾。

你得自己判断。

你得自己动手。

你得自己负责。

你懂的，对吧？

---