プロジェクトの作成
プロジェクトセットアップ
Click the + 新規プロジェクト ボタンをプロジェクトダッシュボードからクリックして作成ウィザードを開きます。最初の画面でテックスタックを選択する前にプロジェクトの基本を設定します。
プロジェクト名
プロジェクト名を入力します。名前はリアルタイムで検証されます — 有効なフォルダ名である必要があり(<>:"/\\|?*などの特殊文字は使用不可)、選択した場所の既存フォルダと競合してはなりません。
プロジェクトの場所
プロジェクトフォルダが作成されるデフォルトディレクトリ。参照をクリックして別のディレクトリを選択できます。プロジェクトはプロジェクト名を使用してサブフォルダとして作成されます。
GitHubにリンク
オプションでGitHubアカウントを選択し、ローカルプロジェクトと一緒にリモートリポジトリを自動作成します。スキップするには「None(デフォルトでGitHubを使用しない)」を選択してください。
プラットフォームを選択
4つのプラットフォームタイルの1つを選択して、構築するプロジェクトのタイプを決定します。各プラットフォームは次の画面で異なるフレームワークとテックスタックのオプションを表示します。
ブランク
CLIツール、スクリプト、ライブラリ
デスクトップ
ネイティブデスクトップアプリ
Web
ブラウザベースアプリ
モバイル
デバイスアプリケーション
ビルドタイプ
プロジェクトの初期化方法を選択します:
新規インストール
標準フレームワークツールを使用して新しいプロジェクトをスキャフォールドします。Kaiju Hub AIは適切なCLIコマンド(例:npm create vite@latest、cargo init、npx create-tauri-app)を実行し、すべての依存関係をインストールします。
AI生成
構築したいものを説明し、AIにプロジェクト全体を生成させます。テキストの説明とオプションの参照画像を提供すると、AIがすべてのソースコード、設定ファイル、プロジェクト構造を記述します。
プロジェクトの設定を構成した後、 テックスタックに進む をクリックして続行します。
ブランクプロジェクト
ブランクプロジェクトは、CLIツール、スクリプト、スタンドアロンアプリケーション、言語固有のスターター向けです。言語またはランタイムを選択すると、Kaiju Hub AIが最小限のプロジェクト構造をスキャフォールドします。
言語 / ランタイムオプション
一部の言語にはバージョンセレクターがあります。例えば、 Python を選択するとバージョンオプション(3.10、3.11、3.12、3.13、3.14、3.15)が表示されます。選択したバージョンにより仮想環境の作成に使用するPythonインタープリターが決まります。
デスクトッププロジェクト
デスクトッププロジェクトはネイティブデスクトップアプリケーションを作成します。デスクトップフレームワーク、UI用のフロントエンドフレームワーク、オプションでデータベースを選択します。すべてのフロントエンドフレームワークはTypeScriptで事前構成されています。
デスクトップフレームワーク
デスクトップウィンドウシェルとシステムレベルのAPIを提供するネイティブフレームワーク。
フロントエンドフレームワーク
デスクトップウィンドウ内で実行されるUIフレームワーク。すべてのオプションはTypeScriptで事前構成されています。
データベース
ローカルまたはクラウドデータストレージ用のオプションのデータベース統合。
Webプロジェクト
Webプロジェクトはブラウザベースのアプリケーションを作成します。まず フロントエンドのみ または フルスタック を選択して利用可能なフレームワークオプションを決定します。すべてのフレームワークはデフォルトでTypeScriptが有効です。
フロントエンドのみ
シングルページアプリと静的サイト用のスタンドアロンUIフレームワーク。独自のnpmパッケージを追加するカスタムパッケージボタンが含まれます。
フルスタック
サーバーサイドレンダリングとAPIルートを内蔵した完全なWebフレームワーク。
スタイリング
データベース
モバイルプロジェクト
モバイルプロジェクトはiOSとAndroid用のデバイスアプリケーションを作成します。モバイルフレームワーク、SDKバージョン、オプションでデータベースを選択します。
モバイルフレームワーク
モバイルアプリケーションのフレームワークを選択します。複数のSDKターゲットをサポートするフレームワークではSDKバージョンセレクターが表示されます。
SDKバージョン
Expoなどのフレームワークでは、SDKバージョン(例:52、53、54、55)を選択します。これにより基本的な依存関係とAPIの互換性が決まります。
データベース
モバイルアプリ用のオプションのクラウドまたはローカルデータベース。
新規インストール
When you choose 新規インストール をビルドタイプとして選択すると、Kaiju Hub AIは標準フレームワークツールを使用してプロジェクトをスキャフォールドします。テックスタックを選択した後、 プロジェクトを作成 をクリックすると、Kaiju Hub AIが残りを処理します。
処理内容
1. パッケージマネージャーの検出
Kaiju Hub AIはシステムにインストールされているパッケージマネージャー(npm、yarn、またはpnpm)を自動的に検出します。
2. スキャフォールドコマンドの実行
選択したスタックに適したCLIツールを実行します。例:React用のnpm create vite@latest、Rust用のcargo init、Tauri用のnpx create-tauri-app。
3. 依存関係のインストール
パッケージマネージャーのインストールコマンドを実行して、必要なすべての依存関係をダウンロードしてセットアップします。
4. Gitの初期化
初期コミットを含むローカルGitリポジトリをセットアップします。
5. GitHubリポジトリの作成
GitHubアカウントをリンクした場合、リモートリポジトリを自動的に作成し、初期コミットをプッシュします。
作成が完了すると、プロジェクトがプロジェクトダッシュボードに表示され、開いてコーディングを開始する準備が整います。
AI生成
When you choose AI生成 をビルドタイプとして選択すると、構築したいものを説明し、AIが初期コードベース全体を記述します。テックスタックを選択した後、 プロジェクトを作成 をクリックしてAI生成画面を開きます。
AIモデル選択
生成画面の上部でAIプロバイダーとモデルを選択します。設定済みの任意のプロバイダー(OpenAI、Anthropic、Gemini、Grok、DeepSeek、Ollama)から選択し、コード生成に使用する特定のモデルを選べます。
プロジェクトの説明
構築したいものの詳細な説明を記述します。具体的であるほど良い結果が得られます。主な機能、ページ、UIパターン、必要な統合を含めてください。
良い例:
- 商品リストとショッピングカートを備えたECサイト
- カンバンボードを備えたタスク管理ダッシュボード
- ユーザープロフィールとフィードを備えたSNSプラットフォーム
- 連絡先管理と分析を備えたCRMシステム
Use the AIで強化 ボタンを使用して説明を自動的にさらに詳細に拡張します。マイクアイコンを中クリックして音声入力で説明を口述することもできます。
サイドバータブ
左サイドバーはAIに追加コンテキストを提供します:
画像
参照画像、モックアップ、スクリーンショットをアップロードして、AIにアプリの見た目を示します。ドラッグ&ドロップ、Ctrl+Vで貼り付け、またはクリックして追加。ビジョン対応モデルの選択が必要です。
コンポーネント
ブロックライブラリから再利用可能なコンポーネントを添付します。AIはこれらを生成されるプロジェクトに組み込みます。
ファイル
AIが生成時に考慮すべき参照ファイルを含めます(例:既存のコード、デザイン仕様、データスキーマ)。
生成
Click プロジェクトを生成 を右上でクリックしてAI生成を開始します。AIが説明と参照資料を分析し、アーキテクチャを計画し、ファイル構造を生成し、すべてのソースコードと設定ファイルを記述します。進捗は グローバルタスクマネージャー でリアルタイムに追跡されます。
