

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開發助手
786.0K