プロジェクト構築

環境セットアップからプロジェクトの初期化まで

Javaプロジェクト構造

バックエンドアーキテクチャの理解

Java機能開発

実際の機能開発方法を学ぶ

Vue3プロジェクト構造

フロントエンドアーキテクチャの理解

Vue3機能開発

フロントエンドコンポーネントの開発

コード生成

コード生成器の使用方法

バックエンドデプロイ

Spring Bootアプリケーションの本番デプロイ

フロントエンドデプロイ

Vue3アプリケーションの本番デプロイ

Nginx設定

リバースプロキシと最適化

6. コード生成

1. コード生成機能の概要

BaiZe Frameworkには強力なコード生成機能が組み込まれています。データベーステーブルを指定するだけで、以下のコードを自動生成できます：

バックエンドコード：Entity、DAO、Manager、Service、Controller、Form、VO、Mapper.xml
フロントエンドコード：Vueページコンポーネント、APIモジュール、定数定義

2. コード生成の使用手順

2.1 データベーステーブルの作成

まず、データベースにテーブルを作成します。

CREATE TABLE t_product (
  product_id BIGINT AUTO_INCREMENT PRIMARY KEY COMMENT '商品ID',
  product_name VARCHAR(100) NOT NULL COMMENT '商品名',
  product_code VARCHAR(50) NOT NULL COMMENT '商品コード',
  category_id BIGINT COMMENT 'カテゴリID',
  price DECIMAL(10, 2) COMMENT '価格',
  stock_count INT DEFAULT 0 COMMENT '在庫数',
  status TINYINT DEFAULT 1 COMMENT 'ステータス 1-有効 0-無効',
  create_time DATETIME DEFAULT CURRENT_TIMESTAMP COMMENT '作成日時',
  update_time DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新日時',
  create_user_id BIGINT COMMENT '作成者ID',
  update_user_id BIGINT COMMENT '更新者ID',
  deleted_flag TINYINT DEFAULT 0 COMMENT '削除フラグ 0-未削除 1-削除済み',
  INDEX idx_category_id (category_id),
  INDEX idx_product_code (product_code)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='商品テーブル';

2.2 コード生成画面を開く

アプリケーションに管理者でログインし、[システム管理] > [コード生成]メニューを開きます。

2.3 テーブル選択と設定

テーブル選択画面で、先ほど作成したt_productテーブルを選択し、「設定」ボタンをクリックします。

2.4 基本設定

基本設定タブで以下の項目を設定します：

モジュール名：business
機能名：商品管理
クラス名：Product
パッケージパス：com.baize.admin.module.business

2.5 フィールド設定

フィールド設定タブで各フィールドの設定を確認・変更します：

Javaフィールド名：自動生成されたキャメルケース名
Java型：Long、String、Integer、BigDecimal等
フィールド名（日本語）：フィールドの表示名
フォームタイプ：入力、テキストエリア、ドロップダウン、日付等
クエリ方法：等号、LIKE、BETWEEN等
必須：必須入力項目かどうか

2.6 フロントエンド設定

フロントエンド設定タブで以下を設定します：

Vueファイルパス：src/views/business/product/product.vue
APIファイルパス：src/api/business/product-api.js
定数ファイルパス：src/constants/business/product-const.js（必要な場合）

2.7 コードの生成

設定完了後、「生成」ボタンをクリックすると、ZIPファイルでコードがダウンロードされます。

3. 生成コードの配置

3.1 バックエンドコードの配置

ダウンロードしたZIPファイルを解凍し、バックエンドコードをプロジェクトの対応するディレクトリに配置します：

baize-backend/baiZe-admin/
└── src/main/java/com/baize/admin/module/business/product/
    ├── controller/ProductController.java
    ├── service/ProductService.java
    ├── manager/ProductManager.java
    ├── dao/ProductDao.java
    └── domain/
        ├── entity/ProductEntity.java
        ├── form/
        │   ├── ProductAddForm.java
        │   ├── ProductUpdateForm.java
        │   └── ProductQueryForm.java
        └── vo/ProductVO.java

baize-backend/baiZe-admin/
└── src/main/resources/mapper/product/
    └── ProductMapper.xml

3.2 フロントエンドコードの配置

フロントエンドコードをプロジェクトの対応するディレクトリに配置します：

baize-frontend/src/
├── api/business/
│   └── product-api.js
├── views/business/product/
│   └── product.vue
└── constants/business/
    └── product-const.js（必要な場合）

4. メニューの登録

バックエンドを再起動後、システム管理画面でメニューを登録します：

メニュータイプ：メニュー
メニュー名：商品管理
コンポーネントパス：business/product/product
アイコン：適切なアイコンを選択

5. カスタマイズ

生成されたコードはベースとして、以下のカスタマイズが可能です：

5.1 バリデーションの追加

@NotBlank(message = "商品名を入力してください")
@Length(max = 100, message = "商品名は100文字以内で入力してください")
private String productName;

5.2 カスタムビジネスロジックの追加

@Transactional(rollbackFor = Exception.class)
public String addProduct(ProductAddForm form) {
    // 重複チェック
    LambdaQueryWrapper<ProductEntity> wrapper = new LambdaQueryWrapper<>()
        .eq(ProductEntity::getProductCode, form.getProductCode());
    if (this.count(wrapper) > 0) {
        throw new BusinessException(ProductErrorCode.PRODUCT_CODE_EXIST);
    }

    // 在庫チェック
    if (form.getStockCount() < 0) {
        throw new BusinessException(ProductErrorCode.STOCK_COUNT_ERROR);
    }

    // 商品追加
    ProductEntity product = BeanUtil.copyProperties(form, ProductEntity.class);
    this.save(product);

    return product.getProductId().toString();
}

5.3 フロントエンドUIのカスタマイズ

生成されたVueコンポーネントは、要件に応じてUIやロジックを調整できます。