Gpt Frontend Code Gen

使用场景生成一个具有 iOS 风格的前端页面。通过持续对话修改页面布局以满足设计需求。使用 Docker 快速部署和启动项目。产品特色使用 GPT-4 生成 R...

  • Gpt Frontend Code Gen

    类别:AI开发助手,AI代码生成,前端开发,页面生成,React,Vite,Koa,GPT-4,普通产品,开源,
    官网:https://github.com/bravekingzhang/gpt-frontend-code-gen 更新时间:2025-08-01 18:33:34
  • 使用场景

    生成一个具有 iOS 风格的前端页面。

    通过持续对话修改页面布局以满足设计需求。

    使用 Docker 快速部署和启动项目。

    产品特色

    使用 GPT-4 生成 React 组件。

    支持 Chakra UI 和 ShadcnUI 组件生成。

    实时预览生成的组件。

    通过持续对话修改和更新组件。

    配置 APIKey 和 BaseUrl,支持多种大模型。

    使用 Docker 和 Docker Compose 一键设置和启动。

    使用教程

    1. 确保开发环境中已安装 Node.js(18以上)和 Docker(可选)。

    2. 在项目根目录下,分别为前端和后端安装依赖。

    3. 启动前端服务:cd frontend,执行 npm install 和 npm run dev。

    4. 启动后端服务:cd ../server,执行 npm install 和 npm run dev。

    5. 打开浏览器,访问 http://localhost:9000,配置 APIKey 和 BaseUrl。

    6. 使用对话式交互生成和修改前端页面。

    7. 利用 Docker 一键启动项目,简化部署流程。