--文末赠书--
shadcn UI是一个新诞生的项目，也是2023年前端领域最火的项目之一。
shadcn UI发布于2023年1月，仅用1年时间，它在GitHub中的star数量就增长至 39.5k ，是2023年在GitHub上star增长最多的前端开源技术。
出自https://risingstars.js.org/2023/zh#section-all
2024年3月，shadcn UI项目的star数增长至50k，截至目前已达到75k，非常接近Ant Design的star数量。
这种成长速度非常惊人，shadcn/ui 究竟有什么魅力呢？为何大家都愿意贡献一颗star给它呢？
参考来源：https://medium.com/%E6%89%8B%E5%AF%AB%E7%AD%86%E8%A8%98/why-shadcn-ui-is-so-popular-in-2023-0f95e66f3ddc
shadcn/ui 是 Vercel 的工程师推出的一款组件合集，建立在 Tailwind CSS 和 Radix UI 之上，目前包括近50个独立组件。根据官方说明，这款产品被定义为「组件合集」，而非传统的「组件库」。
完整的无障碍体验：Shadcn UI 建立于 Radix UI 上，而 Radix UI 所标榜的最大特色之一就是它的 Accessibility——所有元件都遵守 WAI-ARIA 标准规范，且有通过跨浏览器及多种辅助科技的测试。
代码完全由开发者控制：Shadcn UI允许直接访问每个组件的源代码。这意味着可以根据项目的具体需求轻松调整代码，而无须受限于预定义的模板或样式。
避免不必要的依赖：不把整个库作为依赖项添加，有助于减少项目体积，从而提升应用的加载速度。
精细控制与高度可定制：每个组件都是独立的单元，可以单独使用和定制，这种模块化的设计不仅简化了个别组件的定制过程，也便于整体 UI 系统的扩展和维护。
Tailwind CSS 无疑是近年来最常被提及的、实现了 atomic css 的 CSS 框架，而 Shadcn UI 则用 Tailwind CSS 封装了 Radix UI 的元件。
Radix UI 是一个 headless 组件库，这表示它的组件没有任何的样式，它提供了可以定制化样式的方式，让用户自定义组件的样式，将UI的全部样式交给使用者，实现业务需求的高度定制化。
由于Shadcn UI将全部UI样式交给了开发者，这种做法带来了新的挑战。
对开发者的要求较高：需要良好的抽象设计能力来处理无UI层的组件。
需要自己维护：只要开发者修改了其元件的样式，那么就需要开发者自己维护，所以维护也是个难以避免的问题。
需求无法满足：Radix UI 毕竟是小众的元件库，其star数只有 3.4K 而已，不足 Shadcn UI 的十分之一。如果遇到 bug 或是需要新功能，Radix UI能得到的社群资源相当有限。
全局样式的把握：不能只看一个组件的变化，还需要考虑全局UI样式的影响。
定制组件：Shadcn UI组件不如Ant Design组件的功能丰富，无法达到“开箱即用”的程度。
由此可以看出，对于开发者来说，若想要处理好UI组件的样式、全局的把握、定制新的组件，就需要有较高的思维、理解、结构布局等能力。
如果你在工作中使用 Ant Design 或Element Plus 组件库时，需要修改某个组件的功能或是变更组件的交互方式，基本上是难以实现的。因为Ant Design和Element Plus组件库都是被封装好的，底层是耦合的代码，很难进行更改。
如果你自己从未开发过UI组件库，那么将很难理解组件库的整体运行机制和整体流程。
如果你想深入理解组件库的整体运行机制和整体流程，学习如何UI组件库的开发过程，却无从下手。
如果你想寻找一本可以带你从零开始开发UI组件库，且相对完整的、体系化的UI组件库实战书籍。
那么推荐你阅读《Vue.js 3 高级编程：UI组件库开发》这本书。
它是市面上第一本关于UI组件库开发实战的书。
它可以为读者提供 “UI组件库视觉设计规范” 、“Gitee代码仓库源码” 等配套资料。
你可以从中学到以下核心知识。
UI组件开发：包含常用的组件，如Button、Input、Checkbox、Radio、Message、Modal等组件。
组件样式OOCSS设计：BEM命名规则、Sass制定全局变量。
UI组件库文档搭建：解析Markdown文件映射组件，生成组件库文档。
Rollup打包：全量打包、按需加载打包UI组件库。
Gulp多任务：基于流（Stream）的自动化构建工具，使用Gulp实现组件库列表打包任务。
Npm部署：将自己开发的组件库发布到npm官网，实现npm install 安装自己的组件库。
从本书中学习到UI组件库的核心知识，从而掌握组件库的开发并深入理解组件库的运作逻辑，完整实现UI组件库的UI渲染、逻辑交互、功能扩展等多方面的高度制定化，轻松开发属于自己的UI组件库！
↑限时五折优惠↑
限时五折优惠中，快快抢购吧！
互动有奖
欢迎本公众号的粉丝朋友对这本书有兴趣的话，可以扫描下方微信二维码添加微信，并回复UI，第5、10、15、25个的小伙伴可以得到这本书（包邮送出）！祝好运～
为了方便抽奖/兑奖，可以先添加阿浪微信哦 （如果很渴望得到这本书可以直接加下方微信，名额有限！）
