展示HN: GolemUI – JavaScript 表单的新范式
Golem UI React + React Hook Form 89 行 8 个分支 模式序列化(表单作为 JSON)开箱即用的无障碍、键盘、ARIA 适配器 — 带上你自己的库 {gui.} 52 行 0 个分支 模式序列化(表单作为 JSON)开箱即用的无障碍、键盘、ARIA 适配器 — 带上你自己的库 …还有更多(继续滚动 ↓) 在每个框架中使用相同的表单,包括渲染它的代码。开始使用 GitHub ↗ 用于构建表单的新范式。 通过下面的表单看看几行声明性模式如何生成一个完全响应的表单 — 每一步都解锁一个特性,并附有驱动代码。 使用 JSON 架构生成表单。每个字段、规则和布局都是普通 JSON — 可移植的、可存储的、框架独立的。存储它,发送它,生成它;用户界面根据架构自行渲染。你的表单可以存在于任何地方。因为架构是数据,而不是代码,你的表单定义可以旅行到代码无法到达的地方。大多数表单库无法离开代码库。GolemUI 的架构可以。 持久化 将表单保存在数据库中。将表单定义存储在任何数据存储中。进行版本控制。进行差异比较。回滚。与处理内容的方式相同。 投放 从 CMS 提供表单。市场营销和运营团队可以发布、更新,并 A/B 测试表单 — 无需部署,无需工程工单。 生成 使用 LLM 生成表单。要求模型提供表单架构并立即渲染。根据提示、文档或数据库列列表自动生成工作流。 28 个组件。内置电池。 以下是我们一些组件的展示 — 真实的、可访问的、可主题化的,所有组件均来自相同的架构。悬停以停止轮播并与任何一个交互;点击以查看文档。 从可重用的块中组合表单。 编写 gui.* — 一个类型化、可自动补全的构建器 — 重用字段、验证器和逻辑作为块;连接第三方库和你自己的组件。 保存 token$ 。轻松通过审核$ 。 {gui.} 足够小,让你的代理可以流畅输出 — 也足够小,让你的团队一目了然。相同的代码,用于两个工作。 React + React Hook Form 0 tokens 89 行表单代码 · 使用 cl100k_base 进行标记化 GolemUI 0 tokens 52 行 · 在相同表单上的 -41% 开始使用 AI 你能够获得的开箱即用的功能。无障碍、国际化、验证、性能 — 其他库花费你几个月的工作已在你编写单个字段之前解决。 库重量 0 kb 压缩后 LCP 0 ms 最大内容绘制 Lighthouse 0 完美得分 GolemUI DIY 模式序列化(表单作为 JSON)无障碍 — WCAG 2.1 AA & ARIA 国际化(i18n)基于模式的验证 +28 个内置组件 你的品牌。你的规则。 选择一个主题,立即观看表单重新上色。 GolemUI 提供合理的默认设置 — 通过覆盖原生 CSS 变量,你的品牌在上面叠加,无需重建,无需编译步骤,无需粘合代码。撰写一个完整的自定义主题或仅调整一个标记。 一个表单引擎,完全自由。 点击任何字段的药丸以更换其来源 — 我们的内置组件、Material、Shoelace,或者你自己的组件。因为 GolemUI 是引擎,而不是小部件集,所以每个字段都可以来自任何地方:发送我们的默认设置,插入第三方库,或连接你自己的。 在同一表单中混合和匹配。 带上你自己的(几乎)任何东西 … 和几乎所有其他东西 — 中间件拦截反应引擎,项渲染器自定义列表的渲染,依赖配置组件的内部。 BYOFWK 带上你自己的框架 React、Angular、Lit 和 Vue 是一流的 — 或者通过普通的 Web 组件驱动引擎,或集成你自己的。 BYOCS 带上你自己的组件集 在相同的小部件架构下构建自己的组件集。我们做到了 — 并称其为 {gui.}。 BYOV 带上你自己的验证器 任何标准的架构验证器都可以轻松插入 — Zod、Valibot 等等。我们的验证器基于 Zod。 BYOi18n 带上你自己的国际化 通过简单的适配器映射任何国际化库,并保留其擅长的高级功能。准备好开始构建了吗? 不要再与表单状态和逻辑作斗争。使用 GolemUI 在几分钟内开始定义更智能、可序列化的表单。 阅读文档 在 GitHub 上查看 ↗
本站免费、广告极少。如果觉得有帮助,可以请我们喝杯咖啡 —— 任何金额都对持续运营有实际帮助。
☕请我喝杯咖啡