信使 Web builder AI 驱动 UI 生成和发布的低代码平台

307 阅读2分钟

信使 Web Builder:

github.com/biaogebusy/…

AI驱动UI生成和发布的低代码平台,基于TailwindCss,通过拖拽可视化快速构建可自定义、响应式、多主题、多语言的网站应用,拥有完整的前端解决方案。

我这个开源项目纯属偶然,一开始是学习Angular的前端框架,在这过程中慢慢的积累组件,版本升级,看到好的想法不断的加入,面对越来越大的组件库,又经过多次的重构优化。


最近接入了DeepSeek API,用来生成Tailwind组件,SVG,思维导图,翻译,一句话生成页面...看看效果:


像公司官网、银行信用卡营销着陆页、产品宣传页这种经常发布的页面就需要市场人员去搭建,可视化的方式拖拽组件构建可以快速的发布,提高效率。

切换不同设备预览

基于这些组件,已经完全具备构建一个常规的响应式的前后台页面,以往要构建页面是通过手动的方式去copy json,底层的'widget'和'component'都是动态组件,去构建一个Web builder是顺理成章的事情。

功能点:

边栏可拖拽直接从边栏选择组件放入内容区
Layout builder可动态新增栏,栏可以添加多个组件,响应式配置
选择示例页加载加载示例页面到内容区
切换全宽方便大屏编辑,减少干扰
内容区组件导航边栏可通过导航查看组件,可上下拖动排序
智能生成页面根据一定的规则从组件库中生成页面
多主题切换预览预览在多主题下的组件显示情况
页面预览调转到新窗口查看真实的页面
复制整个页面的JSON可直接复制json,部署到后台发布
下载设计的页面可保存当前页面截图到本地
组件编辑删除、复制JSON、编辑组件数据、拖动上下排列
Builder 暗黑风格支持切换浅色风格和暗黑风格,专注内容创作
响应式预览可切换不同设备尺寸查看页面响应式排版
媒体库浏览查看后台上传的媒体资源文件
页面历史版本当提交、清空、加载示例等覆盖操作时新增历史版本

Layout Builder

动态构建Flex布局,可配置每栏的响应式配置,还有通用的样式配置,比如背景色、背景图。通过Layout builder 可以构建无数种形态的复合组件。

体验:

web builderbuilder.design/

如果觉得这个项目对你有帮助,请帮忙点亮Star


最近,我们同时开源了Web builder的CMS和小程序,欢迎Star: