不到 2 年拿下 73K Star 的前端开源项目！

Shadcn UI

Shadcn UI 是由开发者 shadcn 在 2023 年初创建的一个 UI 组件集合。这个项目最初的目标是为了解决 React 生态系统中的一个常见问题：如何在保持组件高度可定制的同时，提供优秀的开发者体验。

Shadcn UI 作者于 2023 年 3 月 8 日正式发布 @shadcn/[email protected] 版本，不到 2 年时间，shadcn/ui 的 Star 数已经高达 73K 。

Shadcn UI 核心理念

1. "不是一个组件库" 的创新理念

Shadcn UI 最显著的特点是它 "不是一个组件库"（Not a component library）。这个看似矛盾的说法实际上体现了项目的核心创新：

• 没有 npm 包安装
• 直接复制组件代码到项目中
• 完全可定制和可控的代码

这种方式打破了传统组件库的范式，让开发者能够完全掌控组件代码。

2. 站在巨人的肩膀

项目在成立之初就选择了一些优秀的技术基石：

• Tailwind CSS 作为样式解决方案
• Radix UI 作为无头组件（headless components）基础
• TypeScript 确保类型安全
• React 作为基础框架（拥有庞大的用户群体）

Shadcn UI 带来的巨大影响力和开发变革，Web 技术社区的开发者，也把 Shadcn UI 移植到 Vue、Angular 和 Flutter 等框架中。

来源：https://shadcn.batchtool.com/

3. 友好的开发体验

简单而强大的 CLI 工具让组件的添加变得异常简单，成为了项目成功的关键因素之一。

npx shadcn-ui@latest init
npx shadcn-ui@latest add button

Awesome Shadcn UI

https://github.com/bytefer/awesome-shadcn-ui

Awesome Shadcn UI 目前包含与 Shadcn UI 有关的 200 多个资源，共 13 个分类。涉及 UI 组件库、Landing Page 模板、SaaS 模板（接入用户认证、支付、数据库等）、Shadcn 扩展、Shadcn 工具等。

来源：https://shadcn.batchtool.com/

SaaS 模板

提供开箱即用的 SaaS 模板 ，让你快速开启 SaaS 项目。

UI 组件库

基于 Shadcn UI 的组件库，提供了很多开箱即用的 “酷炫” 组件。

模板

提供了很多漂亮的 Landing Page 和 Dashboard 模板，让你快速上线产品的 Landing Page。

组件

填补了 Shadcn UI 缺失的组件，从而满足不同的业务场景。