gpt-frontend-code-gen
G
Gpt Frontend Code Gen
紹介 :
gpt-frontend-code-genは、ReactとViteで構築されたフロントエンドプロジェクトで、Koaバックエンドサービスと連携し、フロントエンドページの生成とプレビュー機能を実現します。GPT-4モデルを使用し、Chakra UIとShadcn UIコンポーネントの生成をサポートしており、開発者は対話形式で継続的にページを反復改良し、満足のいく結果を得るまで修正できます。
ターゲットユーザー :
本製品は、特にフロントエンドページの迅速な生成と反復が必要なフロントエンド開発者にお勧めです。対話型のインターフェースにより開発プロセスが簡素化され、開発効率が向上し、開発者はページデザインと機能実装に集中できます。
総訪問数: 502.6M
最も高い割合の地域: US(19.34%)
ウェブサイト閲覧数 : 63.2K
使用シナリオ
iOSスタイルのフロントエンドページを生成する。
継続的な対話を通じて、デザイン要件を満たすようにページレイアウトを修正する。
Dockerを使用して、プロジェクトを迅速にデプロイおよび起動する。
製品特徴
GPT-4を使用してReactコンポーネントを生成します。
Chakra UIとShadcn UIコンポーネントの生成に対応しています。
生成されたコンポーネントをリアルタイムでプレビューします。
継続的な対話を通じてコンポーネントを修正?更新します。
APIキーと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にアクセスして、APIキーとBaseUrlを設定します。
6. 対話型インターフェースを使用して、フロントエンドページを生成および修正します。
7. Dockerを使用してプロジェクトをワンコマンドで起動し、デプロイプロセスを簡素化します。
AIbase
未来を切り開く、あなたのAIソリューション知識ベース
© 2025AIbase