1. XMLUI (blog.jonudell.net)
XMLUI 项目概述
XMLUI 是一个旨在将 Visual Basic 时代的应用开发范式带到现代 Web 的项目。其核心目标是让非专业程序员(解决方案构建者) 能够利用现代 React 组件生态,通过简单的 XML 标记来构建功能完整、响应式且主题化的 Web 应用,而无需深入掌握 React 或 CSS。
核心理念与特性
声明式与组件化:
- 开发者使用 XML 标记来组合预定义的 UI 组件(如
Select、Table、DataSource)和数据绑定。 - 提供丰富的内置组件目录,涵盖交互控件和数据操作(如
APICall、Queue)。 - 支持轻松定义用户自定义组件,并与内置组件无缝互操作。
- 开发者使用 XML 标记来组合预定义的 UI 组件(如
响应式数据绑定:
- 采用类似电子表格的声明式响应模型。变量值的变化会自动传播到所有引用它的组件。
- 示例:一个
Select组件的选择变化可以自动触发一个DataSource组件获取新数据,进而更新Table组件的显示。
主题化与样式系统:
- 提供强大的主题系统,内置合理的默认样式、布局和间距,确保应用开箱即用且外观良好。
- 通过一套层次化的主题变量(如
color-primary、backgroundColor-Button)进行精细控制,设计者可以定义全局或组件级别的样式。 - 鼓励使用主题变量而非内联样式,以保持一致性。
脚本与扩展:
- 允许在 XMLUI 中嵌入有限的 JavaScript 脚本片段,用于数据转换等场景,但强调最小化使用。
- 强大的扩展性:可以封装现有的 React 组件(如富文本编辑器 Tiptap)为 XMLUI 组件,项目提供了相关指南。
与 AI/LLM 的协作
XMLUI 积极拥抱 AI 编程助手,并为此进行了专门设计:
- MCP 服务器:提供了一个 MCP 服务器,允许 AI 代理查询组件文档、源码、示例和使用指南,使其能更好地理解和生成正确的 XMLUI 代码。
- 协作实践:作者分享了与 LLM 协作开发时的规则(如逐步推进、使用现有组件、不依赖内联样式等),并认为 XMLUI 的声明式和文档化特性使其成为人机协作的理想“语义空间”。
- 维护性:与直接生成 React+CSS 代码相比,XMLUI 生成的代码更易于人类阅读、审查和维护。
内容管理与部署
- CMS 能力:XMLUI 自身的官网、文档和演示站点均使用 XMLUI 构建,展示了其作为内容管理工具的易用性。应用与文档可以使用相同的“材料”编写,并支持嵌入实时演示。
- 轻量部署:部署非常简单,核心只需一个包含 XMLUI 框架的
index.html和应用标记文件,可托管于任何静态服务器。
项目愿景
XMLUI 的使命是降低 Web UI 开发的门槛,让非专业前端开发者(如后端工程师、业务开发者)能够像在 Visual Basic 时代一样,通过组合强大组件来构建所需的应用,摆脱当前“JavaScript 工业复杂度”的困扰。项目由 /n software 和 CData 的创始人发起,旨在解决他们自身在构建简单业务 UI 时遇到的困难和挫折。