0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

@yokota101010(shinichi yokota)

【Gemini】テーブル定義からアプリを一発生成！（その３）データモデルのインスタンス自動生成で効率化

0
Posted at

はじめに

近年、LLM（大規模言語モデル）の進化によって「プロンプトからアプリケーションを自動生成する」技術が現実味を帯びてきました。しかし、実際に複雑なシステムを全自動で生成しようとすると、多くのエンジニアが次の壁にぶつかります。

「AIにコードを書かせる際、データ構造やビジネスルールが曖昧だと、生成されるコードはハルシネーション（嘘）だらけになる」

業務システムのモデリングは、大きく分けて「何を管理したいか（帳簿のデザイン）」と「どう管理したいか（画面やAPIのデザイン）」に大別されると思います。この内、AI開発時代に人間がやるべきは「何を管理したいか」をデザインすること、つまりデータモデリングなのではないでしょうか。

本記事では、前回までの記事で簡単に紹介したSchemaDesignerの詳細を示します。
データモデルを精緻に構成し、その作成を視覚的・機能的にトータルサポートするこだわりをご確認ください。
さらに「1枚のポータブルなHTMLファイル」としてどこでも手軽に動かせるスキーマ設計ツールであることも認識して頂けると思います。

SchemaDesignerとは？

SchemaDesignerは、ブラウザ上で動作するスキーマ設計・データベース設計ツールです。
React + Vite + Tailwind CSS (v4) を用いて構築されており、ビルドすると 「1つのHTMLファイル（CSSやJSをすべて内包）」 として出力されます。

  • 画面イメージ
    image.png

    [!TIP]
    ビルド後の dist/index.html は、エクスプローラーからダブルクリックするだけで動作します。ログイン不要、サーバー不要、完全オフラインで動作する超ポータブル設計です。

「データモデルを精緻に作り上げる」ための5つのこだわり

世の中には多くのER図描画ツールやモデリングツールがありますが、SchemaDesignerは「システム自動生成のメタデータとしての完成度」にこだわり、以下の特徴的な機能を備えています。

1. 複合主キー・複合外部キーへの完全対応

実務のデータベース設計、特にレガシーマイグレーションやドメイン駆動設計（DDD）を取り入れた設計では、単一のサロゲートキー（id）だけでなく、ビジネスルールを表す 複合主キー（Composite Primary Key） や、それに伴う 複合外部キー（Composite Foreign Key） が頻繁に登場します。

SchemaDesignerでは、テーブル間のリレーションシップを繋ぐ際、複数のカラムマッピングを視覚的に定義できます。
image.png

多くの簡易ツールが「単一カラムの結合」しかサポートしない中、SchemaDesignerはこれを厳密に定義し、整合性を保ったDDLやモックデータを生成します。

2. 「導出項目」の明示的な定義

パフォーマンスチューニングや、画面表示の都合上、データベースにあえて冗長なデータを持たせる「非正規化（導出項目）」を行うことがあります。
これをただの「カラム」として放置すると、AIや開発メンバが「このデータはどこから更新され、どう整合性を保つべきか」を見失い、自動生成のバグの温床になります。

SchemaDesignerでは、属性区分として「独立（通常カラム）」と「導出項目（Derived）」を明示的に区別し、 導出ロジック をメタデータとして記録できます。
これにより、システム自動生成AIに対する「これは冗長化データだから、参照先が更新された際に同期するトリガー（またはアプリケーションコード）を作れ」という強力な指示書になります。

3. ユースケースを定義する「CRUDマトリクス」

データ構造があるだけでは、システムは動きません。「どの機能（ビジネスロジック）が、どのテーブルに対してどうアクセスするのか」がセットになって初めて、システム全体の仕様が精緻化されます。

SchemaDesignerは、標準で CRUDマトリクス定義機能 を搭載しています。
image.png

これにより、データベース構造とアプリケーションのアクセス仕様が1つの設計図（JSON）に紐付き、APIエンドポイントや画面設計のコード自動生成が一挙に現実味を帯びます。

4. Gemini API連携による「AIモックデータ自動生成」

「このデータモデルで本当に実務の業務が回るか？」を検証する最も手っ取り早い方法は、リアルなサンプルデータを流し込んでみることです。

SchemaDesignerは、Gemini APIと連携し、設計したスキーマおよびリレーションシップ（複合キーを含む！）を解釈して、リレーションの整合性を保ったモックデータを自動生成します。

下図ではAIへの指示として「費目.費目名に”交通費”を追加してください。」を与えることで、交通費に関するインスタンスが追加される様子を示しています。
image.png
image.png

データモデルを精緻に作るプロセスにおいて「モックデータを入れて確認する」フィードバックループがその場で超高速に回せます。

5. ポータビリティとローカルファーストの徹底

どれだけ高機能でも、起動に時間がかかったり、クラウドの契約が必要だったりすると、設計の初動が遅れます。

  • Vite + vite-plugin-singlefile: すべてのアセット（CSS、JS、アイコン）をインライン化。成果物は dist/index.html 1ファイルのみ
  • ローカル自動保存 & ショートカット: 編集内容は localStorage へ即座に自動保存。Ctrl + S で設計データを綺麗なJSON形式でローカルにエクスポート可能
  • DDLエクスポート: 設計が完了したら、ワンクリックで標準的なSQL (DDL) が出力され、そのままデータベースに適用可能

技術スタック

  • フロントエンド: React (v18) / Tailwind CSS (v4)
  • ビルドツール: Vite + vite-plugin-singlefile
  • アイコン: FontAwesome (CDN経由でインライン利用)
  • AI連携: Gemini API (ローカルに安全に保存されたAPIキーを使用)

「システム自動生成の一里塚」としてのデータモデリングと、今後の展望

SchemaDesignerで出力される設計データ（JSON）は、データモデル、リレーション、導出ロジック、CRUDマトリクスが完全に精緻化された 「システムの設計書そのもの」 です。

今後の展望として、このJSONをインプットに受け取り、コードを全自動生成するジェネレータツールの開発を進めていきます。

SchemaDesignerの完成度もまだまだ改善の余地は大いにありますが、これからもAI開発に向けたアイディアを発信していきたいと思います。

参考

  • Antigravity
    ツールの開発にはAntigravity IDEを使用しました。このツールが無ければSchemaDesignerを開発することもなかったと思います。
    https://antigravity.google/
  • 渡辺幸三さんの各種書籍
    いつも勉強させて頂いています。この記事の原点は渡辺式ER図にあります。
    https://dbc.in.coocan.jp/
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?