CSS 写 SQL 查询?后端慌了!

CSS 写 SQL 查询?后端慌了!

初次接触到这个项目时,我的第一反应只有四个字

这也行?

最近在 X 上大火的一个叫 TailwindSQL 的项目,引发了广泛讨论。

其核心玩法非常简单------通过 CSS 的 className 来实现 SQL 查询功能。

前端发展到这个地步了吗?

让我们先看一个示例:

ini 复制代码
<DB className="db-users-name-where-id-1" />

如果你是前端开发者 ,可能会下意识地认为这是在定义样式

但如果你是后端开发者,估计已经开始皱眉了。

然而实际上,这段代码执行的是:

ini 复制代码
SELECT name FROM users WHERE id = 1;

看到这里,我确实愣了一下。

TailwindSQL 的本质

简而言之,它将 SQL 语句拆解为一个个「类名」片段。

这种做法类似于 TailwindCSSCSS 的处理方式:

csharp 复制代码
db-users
db-users-name
db-users-name-where-id-1
db-products-orderby-price-desc

这些 className 最终会被解析为 SQL 语句,并在 React Server Components 中直接执行。

你甚至无需编写 API 接口,也无需使用 ORM 框架。

这个方案可靠吗?

从工程实践的角度来看,答案其实很明确:

并不可靠。

SQL 的复杂性,从来不是语法层面的问题。

真正的挑战在于:

  • 表关系管理

  • 复杂 JOIN 操作

  • 嵌套子查询

  • 事务控制

  • 权限验证

  • 边界条件处理

一旦查询逻辑稍显复杂,className 就会变得越来越冗长,最终形成一串难以维护的代码片段。

说实话,我很难想象在实际项目中,会有开发者认真地写出这样的代码:

ini 复制代码
className="db-orders-user-products-joinwhere-user-age-gt-18and-order-status-paidgroupby-user-id"

这已经不再是 DSL(领域特定语言)了,而是一种折磨。

我认为 TailwindSQL 很难在生产环境中得到应用,它更像是 vibe coding(氛围编程)的产物。

是否使用?可以了解一下,然后继续编写你熟悉的 SQL 吧。

  • TailwindSQL 官网https://tailwindsql.com/
相关推荐
mengchanmian19 分钟前
前端node常用配置
前端
华洛34 分钟前
利好打工人,openclaw不是企业提效工具,而是个人助理
前端·javascript·产品经理
xkxnq44 分钟前
第六阶段:Vue生态高级整合与优化(第93天)Element Plus进阶:自定义主题(变量覆盖)+ 全局配置与组件按需加载优化
前端·javascript·vue.js
reembarkation1 小时前
光标在a-select,鼠标已经移出,下拉框跟随页面滚动
java·数据库·sql
A黄俊辉A2 小时前
vue css中 :global的使用
前端·javascript·vue.js
小码哥_常2 小时前
被EdgeToEdge适配折磨疯了,谁懂!
前端
小码哥_常2 小时前
从Groovy到KTS:Android Gradle脚本的华丽转身
前端
灵感__idea2 小时前
Hello 算法:复杂问题的应对策略
前端·javascript·算法
麦麦鸡腿堡3 小时前
JavaWeb_请求参数,设置响应数据,分层解耦
java·开发语言·前端
Dxy12393102164 小时前
CSS常用样式详解:从基础到进阶的全面指南
前端·css