Saas

Next.js 介绍

介绍了 Next.js 的基本概念和实现原理，以及在 React 中的应用。

2025-11-169 分钟阅读

nextjs saas react

附录 C：Tailwind CSS 速查表（Cheat Sheet）

目录布局 Layout Flexbox Grid 尺寸 Sizing 间距 Spacing 排版 Typography 颜色 Colors 背景 Background 边框 Border 圆角 Radius 阴影 Shadow 透明度 Opacity 变换 Transform 动画 …

2025-11-162 分钟阅读

附录 B：Tailwind + shadcn/ui 最佳实践组件示例

B.0 基础工具：cn 函数（必须有） cn 是 shadcn/ui 的经典组合：clsx + tailwind-merge。在所有组件里用于合并类名并解决冲突。 // src/lib/cn.ts import { type ClassValue, clsx } from …

2025-11-167 分钟阅读

附录 A：Tailwind 全类名一览表

本附录将 Tailwind 所有常用原子类分为 15 大类，覆盖全部能力： A.1 布局（Layout）包含：常规布局(display) 定位(position) Flex Grid 多列布局隐藏控制 A.1.1 Display block inline-block inline flex …

2025-11-163 分钟阅读

第 12 章：Tailwind 与主流 UI 框架全面对比

这一章是整本书的“最终章”，也可以视为企业 UI 技术选型指南，价值极高。本章会深入对比： Tailwind Bootstrap Material UI (MUI) Ant Design Chakra UI Radix UI Headless UI Shadcn/UI Flowbite …

第 11 章：Tailwind 与原子化 CSS 的未来趋势（StyleX / UnoCSS / WindiCSS 深度对比）

这一章是最具战略视野的一章，极其重要：企业如何选择下一代 CSS 技术？ Tailwind 是否会被 UnoCSS 取代？ Meta 的 StyleX 是否会成为未来标准？原子化 + 编译器模式会走向何方？未来的 CSS 工具链演变趋势是什么？ 11.1 当今 CSS 技术的三大路线现代 …

2025-11-166 分钟阅读

第 10 章：Tailwind 在企业级 Design System 的落地方案

本章核心目标：统一的 Design Token 体系多品牌、多主题、多租户的 UI 系统 Tailwind 驱动的 UI 组件库设计—开发完美协作机制 Storybook / Tokens Studio / Figma 链路企业级设计系统治理模式 Tailwind 在设计系统中的位置：

2025-11-166 分钟阅读

第 9 章：Tailwind 与最佳实践 UI 组件体系

这一章是全书最实战、最接地气、工程价值最高的章节之一，主要内容包括：企业级 UI 组件设计原则使用 Tailwind 构建 30+ 高质量 UI 组件 base / variants / states 核心架构组件主题化、暗黑模式、响应式与插件系统结合与 shadcn/ui 的方法论对比 …

第 8 章：Tailwind 生态系统深度解析

本章将覆盖：官方生态（Typography / Forms / Aspect-Ratio / Line-Clamp / Container Queries 等） Tailwind 的周边工具链（Headless UI、Heroicons）第三方生态系统 …

第 7 章：Tailwind 插件系统（Plugin API 深度解析）

本章是 Tailwind 工程化体系的核心章节之一，难度高、内容巨大，面向：企业级前端工程师 UI 架构师 Design System 负责人 Tailwind 高级用户多主题 / 多租户系统研发者 Tailwind 的插件系统，是让它不仅仅是 CSS 框架，而是企业级 UI 编译引擎的核心原因 …