🚀 VJSP 初回使用ガイド

VJSP へようこそ！ 本文書はインストールから初回コード生成までの完全なプロセスで、スマート開発の新体験を迅速に始められるようにガイドします。

第一歩：インストール

お好みのIDEを選択して、VJSPプラグインを一括インストール：

• VS Codeインストールガイド

• IntelliJ IDEA インストールガイド

✅ プラグインは Windows10または11 と macOS システムに完全対応し、追加設定なしに使用できます。

第二歩：ログインと認可

インストール完了後、初回起動時にプラグインが自動的にアカウント登録とログインを案内します：

• VS Code ユーザー：
  VJSPに登録してログイン（VS Code）

• IntelliJ IDEA ユーザー：
  VJSPに登録してログイン（IntelliJ）

ログイン成功后、AIとのインタラクションを開始し、全機能を使用できます。

第三歩：インタラクションモードに慣れる

ログイン後、以下の方法でVJSPとインタラクションできます：

• サイドバーで直接AIと对话し、「ユーザー登录機能の実装方法は？」などの質問ができます
• ショートカットキーを使用：
  • Ctrl/Cmd + L：選択コードを説明または最適化
  • Ctrl/Cmd + I：AIに直接コードを修正させます（プレビュー対応）
• ワークモード（Chat / Plan / Agent）を切り替えて、異なるタスクシナリオに適応

第四歩：プロジェクト初期化

プラグインインストールとログイン完了後、以下の手順でプロジェクトを初期化し、VJSPを使用してください。

4.1 プロジェクトを開く

1. 基本プロジェクトフレームワークをダウンロード（標準ディレクトリ構造を含むテンプレートプロジェクト）。

2. VS CodeまたはIDEAで、上部メニューを順次クリック：

ファイル → フォルダーを開く（または ワークスペースを選択）、

次に、ダウンロードしたプロジェクトフォルダーを現在のワークスペースとして選択してください。

✅ 前提条件：

プロジェクトルートディレクトリに pom.xml（Maven）または build.gradle（Gradle）などのビルド設定ファイルが含まれていることを確認してください。これによりプラットフォームがプロジェクトタイプを正しく識別できます。

ローカルにJDK 1.8+とMaven 3.8+が設定されていること

接続可能な基本データベースが初期化済みであること

4.2 プロジェクト接続の設定 （自動生成 vjspai.yml）

プロジェクトを初めて開いた後、VJSPはルートディレクトリに、設定ファイル vjspai.yml を自動生成します。環境に応じて重要なパラメータを記入してください：

# データソース設定
datasource:
  # データベースドライバクラス名
  driverClassName: com.mysql.cj.jdbc.Driver
  # データベース接続アドレス
  url: jdbc:mysql://localhost/your_db_name
  # データベースユーザー名
  username: your_username
  # データベースパスワード
  password: your_password

# アプリケーションアクセスアドレス（プレビューとデバッグ用）
appUrl: http://localhost:8080/

🔐 セキュリティヒント：機密情報を .gitignore で除外するか、環境変数を使用して認証情報を注入することを推奨します。

vjspai.yml を保存した後、プラットフォームは自動的にローカルサービスを起動します（手動操作は不要）。サービス起動完了後、AIコーディングと視覚化機能を使用できます。

4.3 プロジェクトコンテキストを探索する

サービス起動後、プラグインインターフェースから以下の機能入口にアクセスできます：

機能インターフェース図

• データベーステーブル表示：データベース アイコンをクリックし、現在のデータソースのすべてのデータベーステーブル名を参照。

• ワークフローリスト：ワークフロー アイコンをクリックし、定義済みのビジネスプロセスまたは承認フローを参照。

• プロンプトセンター：プロンプト アイコンをクリックし、定義済みのプロンプトリストを参照。

• 視覚化操作パネル：

  • 右上の データベース視覚化アイコン をクリックし、グラフィックデータベース設計インターフェースに入ります；

  • ワークフロー視覚化アイコン をクリックし、ワークフロー視覚化インターフェースに入り、ドラッグで編集または新しいフローを作成します。

すべての視覚化ビューはコード生成と深く連携し、「所见即所得」の開発体験を実現します。

4.4 要件を入力してコードを生成する

チャット入力ボックスで、自然言語を使用して開発ニーズを描述してください。例如：

「ユーザー管理モジュールを作成してください」

プラットフォームは自動的に：

1. ビジネス意図と技術コンテキストを理解
2. データモデルとインターフェース構造をインテリジェント設計
3. 完全なコード（Controller / Service / DAO + フロントエンドページ）を生成
4. フォーム視覚化プレビューを提供
5. 視覚化微調整をサポート：グラフィックインターフェースで直接フィールド、レイアウトまたはロジックを調整し、手動コーディングは不要

✅ これで、ニーズからコードへのスマート開発ループを完了しました！

第五歩：プロジェクトを実行する

アプリケーション起動後、ブラウザで vjspai.yml で設定された appUrl（例：http://localhost:8080）にアクセスし、生成された完全な機能モジュールを参照できます。

📌 アドバンスドヒント：カスタムテンプレート、ルールエンジンまたはエージェント動作をカスタマイズする必要がある場合、AIリソースセンターを参照してください。