我构建了一个全栈 web 框架，所有内容都在一个文件中

Source: Dev.to

概览

嗨

在过去的几周里，我一直在做一些稍微不一样的事情。

我构建了一个名为 Luxaura 的框架，它让你可以使用单一文件格式 .lux 来创建全栈 Web 应用。

👉 UI、状态、后端逻辑和样式——全部集中在一个地方。

为什么我要构建它

在使用 React 等现代框架时，我总是感受到同样的摩擦：

• 一个功能 = 多个文件
• UI 在这里，状态在那儿，API 在别处
• 不断切换上下文

它能工作，但常常让人感觉……支离破碎。

于是我开始思考：如果一个功能相关的所有内容都放在同一个地方会怎样？

思路

.lux 文件将以下元素组合在一起：

• canvas → UI
• signal → 状态
• receive → 输入
• vault → 后端逻辑（仅服务器）
• paint → 样式

不必在不同层之间跳来跳去，你只需在一个可读的结构中工作。

示例

下面是一个简单的计数器：

receive
    title: String = "My Luxaura App"

signal
    count: 0

canvas
    Scene
        Stack
            Headline ">"
            Body "Clicked > times"

            Trigger "Click me"
                when click:
                    count = count + 1

后端… 同样写在同一个文件里

这是我觉得最有趣的部分。

signal
    status: "Send a message"

vault
    action contact(name, email, message):
        if (!name || !email || !message) {
            return "Please fill every field."
        }
        return `Message received from ${name}`

canvas
    Scene
        Stack
            Trigger "Send"
                when click:
                    status = await vault.contact(name, email, message)

👉 vault 中的代码仅在服务器上运行。无需单独的 API 路由，也不会意外泄露到客户端。

它想要改进的地方

• 减少文件碎片化
• 让全栈开发更“本地化”
• 将后端逻辑清晰分离并保持安全
• 生成以静态为先的 HTML，以提升性能

它目前还不是（的）

• 它没有 React 那样的生态系统
• 仍处于早期实验阶段
• 可能还不适合大型生产应用

我认为它可能适用的场景

Luxaura 可能适合：

• 中小型应用
• 仪表盘
• 内部工具
• 快速原型开发

我现在正在测试的内容

我正在将它与 React、Next.js 等框架进行对比，分别用相同的应用实现来评估。

同时还在做：

• 支持外部库（如 Bootstrap、Anime.js）
• 改进开发者体验
• 让语法更清晰

我非常期待你的反馈

我并不是想“取代 React”。我只是想探索一种不同的构建应用的方式。

如果你感兴趣，可以在这里查看：
https://www.npmjs.com/package/luxaura

我想了解：

• 这对你来说有意义吗？
• 哪些地方让你感到困惑？
• 你会尝试类似的东西吗？

感谢阅读 🙌