ジェミニコーダー#
ジェミニコーダーは、Google の Gemini API、Next.js、Tailwind CSS に基づいた AI アプリ生成ツールです。簡単なテキスト説明を通じて、迅速に完全な Web アプリコードを生成し、Sandpack を組み合わせてリアルタイムのコード編集とプレビュー機能を実現します。ユーザーはアプリの基本的な説明を提供するだけで、システムが自動的に対応するコードとインターフェースを生成し、開発プロセスを大幅に簡素化し、開発効率を向上させます。迅速なプロトタイプ開発や小規模アプリ開発において、ジェミニコーダーは強力なサポートを提供します。
主な機能#
- コード生成：簡単なテキスト説明に基づいて、完全な Web アプリコードを自動生成します。
- リアルタイムプレビュー：実際のコード編集とプレビュー機能を提供し、ユーザーはアプリの効果を即座に確認できます。
- 多モデルサポート：Gemini 1.5 Pro、Gemini 1.5 Flash、Gemini 2.0 Flash Experimental などのモデルに対応し、さまざまな開発ニーズに応えます。
技術原理#
- Gemini API：Google の Gemini API に基づいてコードを生成し、ユーザーのニーズを理解し、要求に合ったコード構造とロジックを生成します。
- Next.js：Web アプリのフレームワークとして、静的生成とサーバーサイドレンダリングをサポートし、アプリの読み込み速度と SEO パフォーマンスを向上させます。
- Tailwind CSS：スタイルフレームワークとして、ユーティリティクラスを組み合わせて複雑なレイアウトとスタイルを実現し、開発効率とコードの保守性を向上させます。
- Sandpack：実際のコード編集とプレビュー機能を提供し、ユーザーに隔離された環境を提供し、安全にコードを編集し、アプリの変化をリアルタイムで確認できます。
ジェミニコーダーの実行方法#
- リポジトリをクローンする
まず、ジェミニコーダーの GitHub リポジトリをクローンします：git clone https://github.com/osanseviero/geminiCoder - 環境を設定する
プロジェクトのルートディレクトリに.env ファイルを作成し、あなたの Google AI Studio API キーを追加します：
GOOGLE_AI_API_KEY=your_api_key_here
- 依存関係をインストールして実行する
プロジェクトの依存関係をインストールし、ローカル開発サーバーを起動します：
npm install
npm run dev
-
アプリにアクセスするブラウザを開き、http://localhost:3000 にアクセスすると、ジェミニコーダーの使用を開始できます。
リソース
HuggingFace リポジトリ：https://huggingface.co/spaces/osanseviero/gemini-coder
GitHub リポジトリ：https://github.com/osanseviero/geminiCoder
Gemini API ドキュメント：https://ai.google.dev/gemini-api/docs
Sandpack ドキュメント：https://sandpack.codesandbox.io/