

Gpt Frontend Code Gen
简介 :
gpt-frontend-code-gen 是一个基于 React 和 Vite 构建的前端项目,结合 Koa 后端服务,实现前端页面生成并预览的功能。它使用 GPT-4 模型,支持 Chakra UI 和 ShadcnUI 组件生成,允许开发者通过对话形式持续迭代和修改页面,直到达到满意的效果。
需求人群 :
该产品适合前端开发者,特别是那些需要快速生成和迭代前端页面的开发者。它通过对话式交互,简化了开发流程,提升了开发效率,使得开发者可以更专注于页面设计和功能实现。
使用场景
生成一个具有 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 一键启动项目,简化部署流程。
精选AI产品推荐

Screenshot To Code
截图转代码是一个简单的应用程序,它使用GPT-4 Vision生成代码,并使用DALL-E 3生成类似的图片。该应用程序具有React/Vite前端和FastAPI后端,您需要具有访问GPT-4 Vision API的OpenAI API密钥。
AI代码生成
1.1M

Openui
构建UI组件通常是一项乏味的工作。OpenUI旨在使这一过程变得有趣、快捷和灵活。这也是我们在W&B用于测试和原型化下一代工具的工具,用于在LLM的基础上构建强大的应用程序。您可以使用想象力描述UI,然后实时查看渲染效果。您可以要求进行更改,并将HTML转换为React、Svelte、Web组件等。就像是V0的开源和不太精致的版本。
AI开发助手
790.2K