产品推荐 2026-07-28

gpt-frontend-code-gen:前端代码生成工具

基于对话生成前端代码,支持本地大模型和多种UI框架。

开源软件跨平台工具

产品简介

gpt-frontend-code-gen 这是一个用于生成前端页面和组件代码的工具,支持Chakra UI和ShadcnUI,通过持续对话实时预览和调整效果。解决开发者快速原型设计和交互效果展示的痛点,适合前端开发者、UI设计师及需要快速展示效果的团队。

gpt-frontend-code-gen 主界面

核心功能

  • 使用GPT-4生成React组件
  • 支持ShadcnUI风格组件生成
  • 实时预览生成的组件
  • 通过对话持续修改和更新组件
  • 配置自定义APIKey和BaseUrl,支持多种大模型

快速开始

  1. 确保Docker已安装(推荐)
  2. 运行`docker-compose up -d --build`
  3. 打开浏览器访问`http://localhost:9000`
  4. 在界面配置你的APIKey和BaseUrl

界面预览

gpt-frontend-code-gen 界面截图

gpt-frontend-code-gen 界面截图

与其他方案对比

对比项gpt-frontend-code-gen同类方案
交互方式支持基于对话的实时调整和预览通常一次性生成,修改需手动编辑代码
部署灵活性支持Docker一键启动,跨平台可能依赖特定环境或复杂配置
大模型集成可配置自定义API,支持本地和多种大模型可能仅支持特定云API

适合谁用

  • 需要快速生成前端原型的前端开发者
  • 需要实时调整UI交互效果的设计师
  • 需要向客户展示页面效果的团队成员或产品经理

下载与版本

当前最新版本为 main,发布于 。支持 Windows、macOS、Linux。

⚠️ 注意:本项目仅提供源代码下载,不包含可直接运行的安装包(exe/dmg/apk 等。下载后需要自行编译构建才能使用,适合有一定开发经验的用户。如果你不熟悉编译流程,建议寻找同类开箱即用的替代方案。

注意事项