生成AI×システム構築 〜製造編〜

ここまでで設計工程が終了し、今後のためにプロジェクトの作成を行いました。

次は製造工程に進みます。
設計した機能をどのように実装するかを考え、実際に各機能のプログラミングを行います。

システム構成
テーブルスクリプト作成
フロントエンド作成
バックエンド作成
メニュー作成
まとめ

システム構成

ひとまず生成AIに任せてみますが、利用する技術や構成についてはこちらで指定します。
何を使って構築するのが良いかも、事前にChatGPTに聞いてみた結果です。
ローカル環境で学習コストが低く、低コストで見繕ってもらいました。
今回は、3層構造のWebシステムで構築してみます。

宗一郎

在庫管理システムを構築したいです。
プロジェクトファイルは構築するために必要な設計書です。
HTML、JavaScript、Python、MySQLを使用して構築する想定です。

ChatGPT

在庫管理システムの構築に必要な設計書・画面HTML・業務仕様書はすべて揃っています。以下の通り、全体像と構築の方向性を整理できます。

✅ システム概要

技術スタック：
HTML + JavaScript（フロント）
Python（FlaskやFastAPIを想定）
MySQL（データベース）

主な機能カテゴリ（機能一覧より）機能一覧:

カテゴリ	機能名	概要
商品管理	商品マスタ登録	商品コード・商品名・単位を登録
入出庫管理	入庫登録・出庫登録	在庫数増減と履歴記録を行う
在庫数量管理	在庫数更新機能	入出庫時に在庫を加減
在庫参照	現在庫照会	商品別の現在庫数を一覧表示
履歴管理	入出庫履歴参照	入出庫の履歴を検索・参照

✅ 実装対象の主要画面（HTMLプロトタイプ）

画面名	ファイル	内容
商品マスタ登録	画面_1_商品マスタ登録.html	商品登録・更新・削除
入庫登録	画面_2_入庫登録.html	入庫数量と入庫日入力、在庫加算
出庫登録	画面_3_出庫登録.html	出庫数量と出庫日入力、在庫減算
現在庫参照	画面_4_現在庫参照.html	在庫一覧表示・検索
入出庫履歴参照	画面_5_入出庫履歴参照.html	履歴の絞り込み検索・表示

✅ 各機能の詳細仕様（機能設計書より）

1. 商品マスタ登録機能設計書_1_商品マスタ登録

主キー：商品コード（10文字以内）
バリデーションあり（必須、重複不可）
INSERT INTO 商品マスタ

2. 入庫登録機能設計書_2_入庫登録

商品コード指定で商品名・単位を自動表示
数量・日付入力 → 在庫数加算＋履歴追加
UPDATE 商品マスタ → INSERT INTO 入出庫履歴

3. 出庫登録機能設計書_3_出庫登録

入庫と同様だが在庫数を減算
在庫不足エラーチェックあり

4. 在庫数更新機能設計書_6_在庫数更新

ロジック共通化可能（IN/OUT区分で加減算）
出庫時マイナス在庫NG
登録者や日時も引数で受け取れる構成

5. 現在庫照会機能設計書_4_現在庫照会

商品マスタに在庫数保持前提（別テーブル分離も可）
部分一致検索＋一覧表示

6. 入出庫履歴参照機能設計書_5_入出庫履歴参照

商品コード・期間指定で絞り込み
商品マスタと結合し、名前・単位も表示
JOIN を用いた SELECT 句あり

✅ 今後のステップ（実装観点）

🔧 1. データベース設計

テーブル定義書（ER図、CREATE文）作成
- 商品マスタ
- 入出庫履歴
- （在庫数は商品マスタ内に保持で可）

⚙️ 2. バックエンド（API）

FlaskまたはFastAPIでルーティング
/product/register, /stock/in, /stock/out, /stock/current, /history などRESTfulに設計

🧪 3. テスト

正常系・異常系を含むテストケースの設計（50項目以上にも対応可能）
PostmanやpytestでAPI検証

🖼️ 4. フロント連携

HTML＋JavaScriptでAPI呼び出し
localStorageからAPI連携に切り替え
データバインディング（例：Vue.js 導入）も将来的に検討可

✅ ご提案

以下の順で構築進行はいかがでしょうか？

DB定義書（Excel/SQL）を作成
Python（Flask）でAPI実装
既存HTML画面からAPIを呼び出す形式に改修
単体テスト仕様書を生成
CSVエクスポートや認証機能の追加を検討

次に進める場合は、以下から選んでご指示ください：

✅ DB定義書（ER図＋SQL）を作成したい
✅ Python側のAPI設計を始めたい（Flask or FastAPI）
✅ HTML画面にAPI呼び出しを組み込みたい
✅ テスト仕様書を作成したい（入出庫・在庫系など）
✅ その他：〇〇

ご希望をどうぞ！

「ご希望をどうぞ！」ということで早速作ってもらいましょう。

テーブルスクリプト作成

まずはMySQL用のCreateTable文を作ってもらいます。

宗一郎

MySQLにテーブルを作成したいです。
Create用のSQLファイルを出力してください。

ChatGPT

✅ 出力対象テーブル（3件）

商品マスタ（商品コード、商品名、単位、在庫数など）
入出庫履歴（履歴記録）
在庫（※商品マスタ内に在庫数を持たせない場合の分離構成）

📝 ファイル出力：create_tables.sql

CreateTable

SQL

-- 商品マスタテーブル
CREATE TABLE 商品マスタ (
  商品コード VARCHAR(10) NOT NULL PRIMARY KEY,
  商品名 VARCHAR(50) NOT NULL,
  単位 VARCHAR(10) NOT NULL,
  在庫数 INT NOT NULL DEFAULT 0,
  登録日時 DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
  最終更新日時 DATETIME DEFAULT NULL,
  最終更新者 VARCHAR(50) DEFAULT NULL,
  UNIQUE KEY 商品コード_UNIQUE (商品コード)
);

-- 入出庫履歴テーブル
CREATE TABLE 入出庫履歴 (
  履歴ID INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
  商品コード VARCHAR(10) NOT NULL,
  入出庫区分 ENUM('IN', 'OUT') NOT NULL,
  入出庫数 INT NOT NULL,
  入出庫日 DATE NOT NULL,
  登録者 VARCHAR(50) DEFAULT NULL,
  登録日時 DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
  FOREIGN KEY (商品コード) REFERENCES 商品マスタ (商品コード)
);

-- （オプション）在庫テーブル（商品マスタと分ける構成にする場合）
-- 商品マスタから在庫数を除外する場合はこちらを使用
CREATE TABLE 在庫 (
  商品コード VARCHAR(10) NOT NULL PRIMARY KEY,
  在庫数 INT NOT NULL DEFAULT 0,
  最終更新日時 DATETIME DEFAULT NULL,
  最終更新者 VARCHAR(50) DEFAULT NULL,
  FOREIGN KEY (商品コード) REFERENCES 商品マスタ (商品コード)
);

-- 商品マスタテーブル
CREATE TABLE 商品マスタ (
  商品コード VARCHAR(10) NOT NULL PRIMARY KEY,
  商品名 VARCHAR(50) NOT NULL,
  単位 VARCHAR(10) NOT NULL,
  在庫数 INT NOT NULL DEFAULT 0,
  登録日時 DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
  最終更新日時 DATETIME DEFAULT NULL,
  最終更新者 VARCHAR(50) DEFAULT NULL,
  UNIQUE KEY 商品コード_UNIQUE (商品コード)
);

-- 入出庫履歴テーブル
CREATE TABLE 入出庫履歴 (
  履歴ID INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
  商品コード VARCHAR(10) NOT NULL,
  入出庫区分 ENUM('IN', 'OUT') NOT NULL,
  入出庫数 INT NOT NULL,
  入出庫日 DATE NOT NULL,
  登録者 VARCHAR(50) DEFAULT NULL,
  登録日時 DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
  FOREIGN KEY (商品コード) REFERENCES 商品マスタ (商品コード)
);

-- （オプション）在庫テーブル（商品マスタと分ける構成にする場合）
-- 商品マスタから在庫数を除外する場合はこちらを使用
CREATE TABLE 在庫 (
  商品コード VARCHAR(10) NOT NULL PRIMARY KEY,
  在庫数 INT NOT NULL DEFAULT 0,
  最終更新日時 DATETIME DEFAULT NULL,
  最終更新者 VARCHAR(50) DEFAULT NULL,
  FOREIGN KEY (商品コード) REFERENCES 商品マスタ (商品コード)
);

🔍補足事項

在庫数をどこに持たせるかは構成方針によります：
- 簡素な構成：商品マスタ に 在庫数 を持たせる（おすすめ）
- 拡張性重視：別途 在庫 テーブルに分離
登録者 や 更新者 のカラムは業務ログや管理画面拡張を想定して追加済
文字コードや照合順序はMySQLサーバのデフォルト設定に準じています（必要に応じて CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci などを追記可能）

オプションとして在庫テーブルが追加されてますね。
在庫数が商品マスタにあるのは、確かに違和感があります。
ただ、在庫テーブルに分けるとしても在庫数しか項目がないので、今回は商品マスタで在庫数を管理したいと思います。

また、テーブル名やカラム名が日本語になってしまってます。
こちらもそのままで進んでみようと思います。

フロントエンド作成

次に、各機能のフロントエンドのHTMLコードを作成してもらいます。
プロンプトは特にひねりもないですが、汲み取ってくれるでしょうか。

宗一郎

「商品マスタ登録」の実装を行いたいです。
フロント部分のコードを出力してください。

ChatGPT

了解しました。
以下は「商品マスタ登録」の機能に対応する フロントエンドコード（HTML＋JavaScript） です。
今回は、API連携を前提とした実装で、バックエンド（FlaskやFastAPIなど）に対して POST, PUT, DELETE, GET を行う構成です。

✅ 機能一覧（商品マスタ登録画面）

機能	方法	API呼び出し
登録	POST	`/api/products`
更新	PUT	`/api/products/{code}`
削除	DELETE	`/api/products/{code}`
一覧取得	GET	`/api/products`

🖼️ フロントエンドコード（product.html）

HTMLコード

HTML

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>商品マスタ登録</title>
  <style>
    body {
      font-family: sans-serif;
      padding: 2rem;
      background-color: #f4f4f4;
    }
    h1 {
      text-align: center;
    }
    label {
      display: inline-block;
      width: 100px;
      margin-top: 10px;
    }
    input[type="text"] {
      width: 200px;
      padding: 0.4rem;
      margin-bottom: 10px;
    }
    .buttons {
      margin-top: 1rem;
    }
    .buttons button {
      padding: 0.5rem 1rem;
      margin-right: 10px;
    }
    table {
      margin-top: 2rem;
      width: 100%;
      border-collapse: collapse;
    }
    th, td {
      border: 1px solid #ccc;
      padding: 0.5rem;
    }
    th {
      background-color: #eee;
    }
  </style>
</head>
<body>

  <h1>商品マスタ登録</h1>

  <div>
    <label for="code">商品コード</label>
    <input type="text" id="code"><br>
    <label for="name">商品名</label>
    <input type="text" id="name"><br>
    <label for="unit">単位</label>
    <input type="text" id="unit"><br>

    <div class="buttons">
      <button onclick="register()">登録</button>
      <button onclick="update()">更新</button>
      <button onclick="remove()">削除</button>
      <button onclick="clearForm()">クリア</button>
    </div>
  </div>

  <h2>登録済み商品一覧</h2>
  <table id="productTable">
    <thead>
      <tr>
        <th>商品コード</th>
        <th>商品名</th>
        <th>単位</th>
      </tr>
    </thead>
    <tbody></tbody>
  </table>

  <script>
    const apiBase = '/api/products';
    const tbody = document.querySelector("#productTable tbody");

    async function fetchProducts() {
      const res = await fetch(apiBase);
      const data = await res.json();
      tbody.innerHTML = '';
      data.forEach(p => {
        const row = tbody.insertRow();
        row.insertCell().innerText = p.code;
        row.insertCell().innerText = p.name;
        row.insertCell().innerText = p.unit;
        row.onclick = () => {
          document.getElementById("code").value = p.code;
          document.getElementById("name").value = p.name;
          document.getElementById("unit").value = p.unit;
        };
      });
    }

    async function register() {
      const product = getFormData();
      if (!validate(product)) return;
      const res = await fetch(apiBase, {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(product)
      });
      if (res.ok) {
        alert("登録成功");
        clearForm();
        fetchProducts();
      } else {
        const msg = await res.text();
        alert("登録失敗: " + msg);
      }
    }

    async function update() {
      const product = getFormData();
      if (!product.code) return alert("商品コードを入力してください");
      const res = await fetch(`${apiBase}/${product.code}`, {
        method: 'PUT',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(product)
      });
      if (res.ok) {
        alert("更新成功");
        clearForm();
        fetchProducts();
      } else {
        const msg = await res.text();
        alert("更新失敗: " + msg);
      }
    }

    async function remove() {
      const code = document.getElementById("code").value.trim();
      if (!code) return alert("商品コードを入力してください");
      if (!confirm("本当に削除しますか？")) return;
      const res = await fetch(`${apiBase}/${code}`, { method: 'DELETE' });
      if (res.ok) {
        alert("削除成功");
        clearForm();
        fetchProducts();
      } else {
        const msg = await res.text();
        alert("削除失敗: " + msg);
      }
    }

    function getFormData() {
      return {
        code: document.getElementById("code").value.trim(),
        name: document.getElementById("name").value.trim(),
        unit: document.getElementById("unit").value.trim()
      };
    }

    function validate({ code, name, unit }) {
      if (!code || !name || !unit) {
        alert("全ての項目を入力してください");
        return false;
      }
      return true;
    }

    function clearForm() {
      document.getElementById("code").value = "";
      document.getElementById("name").value = "";
      document.getElementById("unit").value = "";
    }

    window.onload = fetchProducts;
  </script>

</body>
</html>

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>商品マスタ登録</title>
  <style>
    body {
      font-family: sans-serif;
      padding: 2rem;
      background-color: #f4f4f4;
    }
    h1 {
      text-align: center;
    }
    label {
      display: inline-block;
      width: 100px;
      margin-top: 10px;
    }
    input[type="text"] {
      width: 200px;
      padding: 0.4rem;
      margin-bottom: 10px;
    }
    .buttons {
      margin-top: 1rem;
    }
    .buttons button {
      padding: 0.5rem 1rem;
      margin-right: 10px;
    }
    table {
      margin-top: 2rem;
      width: 100%;
      border-collapse: collapse;
    }
    th, td {
      border: 1px solid #ccc;
      padding: 0.5rem;
    }
    th {
      background-color: #eee;
    }
  </style>
</head>
<body>

  <h1>商品マスタ登録</h1>

  <div>
    <label for="code">商品コード</label>
    <input type="text" id="code"><br>
    <label for="name">商品名</label>
    <input type="text" id="name"><br>
    <label for="unit">単位</label>
    <input type="text" id="unit"><br>

    <div class="buttons">
      <button onclick="register()">登録</button>
      <button onclick="update()">更新</button>
      <button onclick="remove()">削除</button>
      <button onclick="clearForm()">クリア</button>
    </div>
  </div>

  <h2>登録済み商品一覧</h2>
  <table id="productTable">
    <thead>
      <tr>
        <th>商品コード</th>
        <th>商品名</th>
        <th>単位</th>
      </tr>
    </thead>
    <tbody></tbody>
  </table>

  <script>
    const apiBase = '/api/products';
    const tbody = document.querySelector("#productTable tbody");

    async function fetchProducts() {
      const res = await fetch(apiBase);
      const data = await res.json();
      tbody.innerHTML = '';
      data.forEach(p => {
        const row = tbody.insertRow();
        row.insertCell().innerText = p.code;
        row.insertCell().innerText = p.name;
        row.insertCell().innerText = p.unit;
        row.onclick = () => {
          document.getElementById("code").value = p.code;
          document.getElementById("name").value = p.name;
          document.getElementById("unit").value = p.unit;
        };
      });
    }

    async function register() {
      const product = getFormData();
      if (!validate(product)) return;
      const res = await fetch(apiBase, {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(product)
      });
      if (res.ok) {
        alert("登録成功");
        clearForm();
        fetchProducts();
      } else {
        const msg = await res.text();
        alert("登録失敗: " + msg);
      }
    }

    async function update() {
      const product = getFormData();
      if (!product.code) return alert("商品コードを入力してください");
      const res = await fetch(`${apiBase}/${product.code}`, {
        method: 'PUT',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(product)
      });
      if (res.ok) {
        alert("更新成功");
        clearForm();
        fetchProducts();
      } else {
        const msg = await res.text();
        alert("更新失敗: " + msg);
      }
    }

    async function remove() {
      const code = document.getElementById("code").value.trim();
      if (!code) return alert("商品コードを入力してください");
      if (!confirm("本当に削除しますか？")) return;
      const res = await fetch(`${apiBase}/${code}`, { method: 'DELETE' });
      if (res.ok) {
        alert("削除成功");
        clearForm();
        fetchProducts();
      } else {
        const msg = await res.text();
        alert("削除失敗: " + msg);
      }
    }

    function getFormData() {
      return {
        code: document.getElementById("code").value.trim(),
        name: document.getElementById("name").value.trim(),
        unit: document.getElementById("unit").value.trim()
      };
    }

    function validate({ code, name, unit }) {
      if (!code || !name || !unit) {
        alert("全ての項目を入力してください");
        return false;
      }
      return true;
    }

    function clearForm() {
      document.getElementById("code").value = "";
      document.getElementById("name").value = "";
      document.getElementById("unit").value = "";
    }

    window.onload = fetchProducts;
  </script>

</body>
</html>

🚀 次のステップ

このフロントエンドと連携するための バックエンドAPI（Flask or FastAPI） を作成する必要があります。
ご希望があれば、PythonでのAPIサーバーのサンプルコード（Flask or FastAPI）もすぐご用意できます。

単純なプロンプトでしたが、設計書の内容を汲み取ってHTMLコードにしてくれましたね。
出力されたHTMLコードは「product.html」として保存しておきます。

プロンプトには機能名と欲しい情報を入力しただけですが、プロジェクトファイルの中から対象の機能設計書を読み取り、その内容からフロント部分のコードのみを作成してくれました。ここが凄いところです。

今回は必要最低限ということで単純な内容でしたが、どの程度複雑な内容まで読み取ってくれるか試してみたいですね。
項目や理内容で数十の内容を理解してくれれば、業務で十分使えそうです。

割愛しますが、他の機能についても同様にフロント部分のコードを作成してもらいます。

バックエンド作成

次にバックエンドのコードを出力してもらいます。
プロンプトは簡素なもので、フレームワークも何でも良いので特に指定しません。

宗一郎

「商品マスタ登録」のバックエンドのコードを出力してください。

ChatGPT

以下は、「商品マスタ登録」機能に対応した バックエンド実装（Flask版） のサンプルです。
このAPIは、先ほどのフロントエンドコードと連携し、MySQLに対して商品登録・更新・削除・一覧取得を行います。

✅ Flask構成（ファイル名例: app.py）

Pythonコード

Python

from flask import Flask, request, jsonify
from flask_mysqldb import MySQL
from flask_cors import CORS
import MySQLdb.cursors

app = Flask(__name__)
CORS(app)

# --- MySQL接続設定（適宜変更してください） ---
app.config['MYSQL_HOST'] = 'localhost'
app.config['MYSQL_USER'] = 'root'
app.config['MYSQL_PASSWORD'] = 'your_password'
app.config['MYSQL_DB'] = 'inventory_db'
app.config['MYSQL_CURSORCLASS'] = 'DictCursor'

mysql = MySQL(app)

# --- 商品一覧取得（GET） ---
@app.route('/api/products', methods=['GET'])
def get_products():
    cursor = mysql.connection.cursor()
    cursor.execute("SELECT 商品コード AS code, 商品名 AS name, 単位 AS unit FROM 商品マスタ")
    products = cursor.fetchall()
    return jsonify(products), 200

# --- 商品登録（POST） ---
@app.route('/api/products', methods=['POST'])
def add_product():
    data = request.json
    code = data.get('code')
    name = data.get('name')
    unit = data.get('unit')

    if not code or not name or not unit:
        return '全項目を入力してください', 400

    cursor = mysql.connection.cursor()
    cursor.execute("SELECT 1 FROM 商品マスタ WHERE 商品コード = %s", (code,))
    if cursor.fetchone():
        return 'この商品コードはすでに登録されています', 409

    cursor.execute("""
        INSERT INTO 商品マスタ (商品コード, 商品名, 単位, 登録日時)
        VALUES (%s, %s, %s, NOW())
    """, (code, name, unit))
    mysql.connection.commit()
    return '登録成功', 201

# --- 商品更新（PUT） ---
@app.route('/api/products/<code>', methods=['PUT'])
def update_product(code):
    data = request.json
    name = data.get('name')
    unit = data.get('unit')

    cursor = mysql.connection.cursor()
    cursor.execute("SELECT 1 FROM 商品マスタ WHERE 商品コード = %s", (code,))
    if not cursor.fetchone():
        return '商品コードが存在しません', 404

    cursor.execute("""
        UPDATE 商品マスタ
        SET 商品名 = %s, 単位 = %s, 最終更新日時 = NOW()
        WHERE 商品コード = %s
    """, (name, unit, code))
    mysql.connection.commit()
    return '更新成功', 200

# --- 商品削除（DELETE） ---
@app.route('/api/products/<code>', methods=['DELETE'])
def delete_product(code):
    cursor = mysql.connection.cursor()
    cursor.execute("SELECT 1 FROM 商品マスタ WHERE 商品コード = %s", (code,))
    if not cursor.fetchone():
        return '商品コードが存在しません', 404

    cursor.execute("DELETE FROM 商品マスタ WHERE 商品コード = %s", (code,))
    mysql.connection.commit()
    return '削除成功', 200

# --- アプリ起動 ---
if __name__ == '__main__':
    app.run(debug=True)

from flask import Flask, request, jsonify
from flask_mysqldb import MySQL
from flask_cors import CORS
import MySQLdb.cursors

app = Flask(__name__)
CORS(app)

# --- MySQL接続設定（適宜変更してください） ---
app.config['MYSQL_HOST'] = 'localhost'
app.config['MYSQL_USER'] = 'root'
app.config['MYSQL_PASSWORD'] = 'your_password'
app.config['MYSQL_DB'] = 'inventory_db'
app.config['MYSQL_CURSORCLASS'] = 'DictCursor'

mysql = MySQL(app)

# --- 商品一覧取得（GET） ---
@app.route('/api/products', methods=['GET'])
def get_products():
    cursor = mysql.connection.cursor()
    cursor.execute("SELECT 商品コード AS code, 商品名 AS name, 単位 AS unit FROM 商品マスタ")
    products = cursor.fetchall()
    return jsonify(products), 200

# --- 商品登録（POST） ---
@app.route('/api/products', methods=['POST'])
def add_product():
    data = request.json
    code = data.get('code')
    name = data.get('name')
    unit = data.get('unit')

    if not code or not name or not unit:
        return '全項目を入力してください', 400

    cursor = mysql.connection.cursor()
    cursor.execute("SELECT 1 FROM 商品マスタ WHERE 商品コード = %s", (code,))
    if cursor.fetchone():
        return 'この商品コードはすでに登録されています', 409

    cursor.execute("""
        INSERT INTO 商品マスタ (商品コード, 商品名, 単位, 登録日時)
        VALUES (%s, %s, %s, NOW())
    """, (code, name, unit))
    mysql.connection.commit()
    return '登録成功', 201

# --- 商品更新（PUT） ---
@app.route('/api/products/<code>', methods=['PUT'])
def update_product(code):
    data = request.json
    name = data.get('name')
    unit = data.get('unit')

    cursor = mysql.connection.cursor()
    cursor.execute("SELECT 1 FROM 商品マスタ WHERE 商品コード = %s", (code,))
    if not cursor.fetchone():
        return '商品コードが存在しません', 404

    cursor.execute("""
        UPDATE 商品マスタ
        SET 商品名 = %s, 単位 = %s, 最終更新日時 = NOW()
        WHERE 商品コード = %s
    """, (name, unit, code))
    mysql.connection.commit()
    return '更新成功', 200

# --- 商品削除（DELETE） ---
@app.route('/api/products/<code>', methods=['DELETE'])
def delete_product(code):
    cursor = mysql.connection.cursor()
    cursor.execute("SELECT 1 FROM 商品マスタ WHERE 商品コード = %s", (code,))
    if not cursor.fetchone():
        return '商品コードが存在しません', 404

    cursor.execute("DELETE FROM 商品マスタ WHERE 商品コード = %s", (code,))
    mysql.connection.commit()
    return '削除成功', 200

# --- アプリ起動 ---
if __name__ == '__main__':
    app.run(debug=True)

🔧 必要なパッケージインストール（仮想環境で）

pip install flask flask-cors flask-mysqldb

🛠 注意点

MySQLのテーブルは先ほど提供した 商品マスタ 用の CREATE TABLE を使用してください。
パスワードやDB名は環境に合わせて書き換えてください。
フロント側から http://localhost:5000/api/products にアクセスする設計です。

Flaskを使用してAPIを作ってくれましたね。
読込/登録/更新/削除と必要なAPIが揃っています。
また、各APIではSQL文が作成され、DBデータに関するチェックまで実装されています。
業務的な実装は大丈夫そうですね。

補足としてパッケージインストールのコマンドまでつけてくれていますね。
出力されたコード見ながら「インストール必要だなぁ」と思ってたとこなので助かります。

続けて残りの機能のコードについても出力してもらいましょう。

宗一郎

他の機能のバックエンドのコードを出力してください。

ChatGPT

承知しました。
「在庫管理システム」に含まれる**他の主要機能のバックエンドAPI（Flask + MySQL）**を以下に実装します。

✅ 対象機能とエンドポイント一覧

機能	HTTPメソッド	パス	内容
入庫登録	POST	`/api/stock/in`	商品の在庫を加算し履歴登録
出庫登録	POST	`/api/stock/out`	商品の在庫を減算し履歴登録
現在庫一覧照会	GET	`/api/stock`	商品別在庫数の取得
入出庫履歴参照	GET	`/api/history`	検索条件で履歴抽出

🐍 Flaskバックエンド実装（app.pyの続きに追加）

Pythonコード

Python

from datetime import datetime
from flask import request

# --- 入庫登録（在庫加算＋履歴追加） ---
@app.route('/api/stock/in', methods=['POST'])
def stock_in():
    return process_stock_transaction('IN')

# --- 出庫登録（在庫減算＋履歴追加） ---
@app.route('/api/stock/out', methods=['POST'])
def stock_out():
    return process_stock_transaction('OUT')

def process_stock_transaction(transaction_type):
    data = request.json
    code = data.get('code')
    qty = int(data.get('qty', 0))
    date = data.get('date', datetime.today().strftime('%Y-%m-%d'))
    user = data.get('user', 'system')

    if not code or qty <= 0 or not date:
        return '入力内容に誤りがあります', 400

    cursor = mysql.connection.cursor()
    cursor.execute("SELECT 在庫数 FROM 商品マスタ WHERE 商品コード = %s", (code,))
    product = cursor.fetchone()

    if not product:
        return '商品コードが存在しません', 404

    current_stock = product['在庫数']
    new_stock = current_stock + qty if transaction_type == 'IN' else current_stock - qty

    if new_stock < 0:
        return '在庫数が不足しています', 400

    cursor.execute("""
        UPDATE 商品マスタ
        SET 在庫数 = %s, 最終更新日時 = %s, 最終更新者 = %s
        WHERE 商品コード = %s
    """, (new_stock, date, user, code))

    cursor.execute("""
        INSERT INTO 入出庫履歴 (商品コード, 入出庫区分, 入出庫数, 入出庫日, 登録者)
        VALUES (%s, %s, %s, %s, %s)
    """, (code, transaction_type, qty, date, user))

    mysql.connection.commit()
    return '処理成功', 200

# --- 現在庫照会（GET） ---
@app.route('/api/stock', methods=['GET'])
def get_stock():
    keyword = request.args.get('code', '')
    cursor = mysql.connection.cursor()
    cursor.execute("""
        SELECT 商品コード AS code, 商品名 AS name, 在庫数 AS stock, 単位 AS unit
        FROM 商品マスタ
        WHERE 商品コード LIKE %s
    """, ('%' + keyword + '%',))
    return jsonify(cursor.fetchall()), 200

# --- 入出庫履歴検索（GET） ---
@app.route('/api/history', methods=['GET'])
def get_history():
    code = request.args.get('code', '')
    from_date = request.args.get('from')
    to_date = request.args.get('to')

    sql = """
        SELECT h.商品コード AS code, p.商品名 AS name, h.入出庫日 AS date,
               h.入出庫区分 AS type, h.入出庫数 AS qty, p.単位 AS unit
        FROM 入出庫履歴 h
        JOIN 商品マスタ p ON h.商品コード = p.商品コード
        WHERE h.商品コード LIKE %s
    """
    params = ['%' + code + '%']

    if from_date:
        sql += " AND h.入出庫日 >= %s"
        params.append(from_date)
    if to_date:
        sql += " AND h.入出庫日 <= %s"
        params.append(to_date)

    sql += " ORDER BY h.入出庫日 DESC LIMIT 100"

    cursor = mysql.connection.cursor()
    cursor.execute(sql, tuple(params))
    return jsonify(cursor.fetchall()), 200

from datetime import datetime
from flask import request

# --- 入庫登録（在庫加算＋履歴追加） ---
@app.route('/api/stock/in', methods=['POST'])
def stock_in():
    return process_stock_transaction('IN')

# --- 出庫登録（在庫減算＋履歴追加） ---
@app.route('/api/stock/out', methods=['POST'])
def stock_out():
    return process_stock_transaction('OUT')

def process_stock_transaction(transaction_type):
    data = request.json
    code = data.get('code')
    qty = int(data.get('qty', 0))
    date = data.get('date', datetime.today().strftime('%Y-%m-%d'))
    user = data.get('user', 'system')

    if not code or qty <= 0 or not date:
        return '入力内容に誤りがあります', 400

    cursor = mysql.connection.cursor()
    cursor.execute("SELECT 在庫数 FROM 商品マスタ WHERE 商品コード = %s", (code,))
    product = cursor.fetchone()

    if not product:
        return '商品コードが存在しません', 404

    current_stock = product['在庫数']
    new_stock = current_stock + qty if transaction_type == 'IN' else current_stock - qty

    if new_stock < 0:
        return '在庫数が不足しています', 400

    cursor.execute("""
        UPDATE 商品マスタ
        SET 在庫数 = %s, 最終更新日時 = %s, 最終更新者 = %s
        WHERE 商品コード = %s
    """, (new_stock, date, user, code))

    cursor.execute("""
        INSERT INTO 入出庫履歴 (商品コード, 入出庫区分, 入出庫数, 入出庫日, 登録者)
        VALUES (%s, %s, %s, %s, %s)
    """, (code, transaction_type, qty, date, user))

    mysql.connection.commit()
    return '処理成功', 200

# --- 現在庫照会（GET） ---
@app.route('/api/stock', methods=['GET'])
def get_stock():
    keyword = request.args.get('code', '')
    cursor = mysql.connection.cursor()
    cursor.execute("""
        SELECT 商品コード AS code, 商品名 AS name, 在庫数 AS stock, 単位 AS unit
        FROM 商品マスタ
        WHERE 商品コード LIKE %s
    """, ('%' + keyword + '%',))
    return jsonify(cursor.fetchall()), 200

# --- 入出庫履歴検索（GET） ---
@app.route('/api/history', methods=['GET'])
def get_history():
    code = request.args.get('code', '')
    from_date = request.args.get('from')
    to_date = request.args.get('to')

    sql = """
        SELECT h.商品コード AS code, p.商品名 AS name, h.入出庫日 AS date,
               h.入出庫区分 AS type, h.入出庫数 AS qty, p.単位 AS unit
        FROM 入出庫履歴 h
        JOIN 商品マスタ p ON h.商品コード = p.商品コード
        WHERE h.商品コード LIKE %s
    """
    params = ['%' + code + '%']

    if from_date:
        sql += " AND h.入出庫日 >= %s"
        params.append(from_date)
    if to_date:
        sql += " AND h.入出庫日 <= %s"
        params.append(to_date)

    sql += " ORDER BY h.入出庫日 DESC LIMIT 100"

    cursor = mysql.connection.cursor()
    cursor.execute(sql, tuple(params))
    return jsonify(cursor.fetchall()), 200

🛠 補足と拡張ポイント

入出庫処理 は IN/OUT を切り替える共通関数 process_stock_transaction() で実装
登録ユーザー（user） は仮に 'system' 固定ですが、将来のログイン連携を想定
例外処理・ログ記録・トランザクション分離は本番構成で強化可能です

こちらも大丈夫ですね。
データベース定義とSQLの内容も一致しています。
また、特筆すべきなのが入庫/出庫の処理については共通関数化までしてくれていますね。

機能を分けて作ってもらいましたが、出力ファイルはapp.pyで共通ですね。
手作業で結合してapp.pyとして保存しておきましょう。

以上でバックエンドのソース生成は終了です。

メニュー作成

最後に一つ忘れていました。
各機能を呼び出すメニューを作成したいと思います。
機能数も少ないので、サイドメニュー形式で作ってもらいましょう。

これらの機能を呼び出すメニュー機能を作成したいです。
サイドメニューで各機能を表示する形式にしてください。

以下は、サイドメニュー付きの在庫管理画面（SPA風構成）です。
画面左にメニューを固定表示し、右側に各機能画面（HTMLファイル）をiframeで読み込み表示します。

✅ 機能構成（切り替え対象の画面）

メニュー名	読み込むHTMLファイル名
商品マスタ登録	`product.html`
入庫登録	`stock_in.html`
出庫登録	`stock_out.html`
現在庫照会	`stock_list.html`
入出庫履歴参照	`history.html`

🖼️ サイドメニュー画面（menu_frame.html）

HTMLコード

HTML

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>在庫管理システム</title>
  <style>
    body {
      margin: 0;
      font-family: sans-serif;
      display: flex;
      height: 100vh;
    }
    .sidebar {
      width: 220px;
      background-color: #2c3e50;
      color: white;
      padding-top: 2rem;
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }
    .sidebar button {
      width: 100%;
      padding: 1rem;
      font-size: 1rem;
      border: none;
      background: none;
      color: inherit;
      text-align: left;
      cursor: pointer;
      transition: background-color 0.2s;
    }
    .sidebar button:hover {
      background-color: #34495e;
    }
    .main {
      flex-grow: 1;
      background-color: #ecf0f1;
    }
    iframe {
      width: 100%;
      height: 100%;
      border: none;
    }
    h1 {
      padding: 1rem;
      margin: 0;
      background-color: #34495e;
      color: white;
      text-align: center;
    }
  </style>
</head>
<body>

  <div class="sidebar">
    <button onclick="loadPage('product.html')">商品マスタ登録</button>
    <button onclick="loadPage('stock_in.html')">入庫登録</button>
    <button onclick="loadPage('stock_out.html')">出庫登録</button>
    <button onclick="loadPage('stock_list.html')">現在庫照会</button>
    <button onclick="loadPage('history.html')">入出庫履歴参照</button>
  </div>

  <div class="main">
    <h1>在庫管理システム</h1>
    <iframe id="contentFrame" src="product.html"></iframe>
  </div>

  <script>
    function loadPage(url) {
      document.getElementById("contentFrame").src = url;
    }
  </script>

</body>
</html>

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>在庫管理システム</title>
  <style>
    body {
      margin: 0;
      font-family: sans-serif;
      display: flex;
      height: 100vh;
    }
    .sidebar {
      width: 220px;
      background-color: #2c3e50;
      color: white;
      padding-top: 2rem;
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }
    .sidebar button {
      width: 100%;
      padding: 1rem;
      font-size: 1rem;
      border: none;
      background: none;
      color: inherit;
      text-align: left;
      cursor: pointer;
      transition: background-color 0.2s;
    }
    .sidebar button:hover {
      background-color: #34495e;
    }
    .main {
      flex-grow: 1;
      background-color: #ecf0f1;
    }
    iframe {
      width: 100%;
      height: 100%;
      border: none;
    }
    h1 {
      padding: 1rem;
      margin: 0;
      background-color: #34495e;
      color: white;
      text-align: center;
    }
  </style>
</head>
<body>

  <div class="sidebar">
    <button onclick="loadPage('product.html')">商品マスタ登録</button>
    <button onclick="loadPage('stock_in.html')">入庫登録</button>
    <button onclick="loadPage('stock_out.html')">出庫登録</button>
    <button onclick="loadPage('stock_list.html')">現在庫照会</button>
    <button onclick="loadPage('history.html')">入出庫履歴参照</button>
  </div>

  <div class="main">
    <h1>在庫管理システム</h1>
    <iframe id="contentFrame" src="product.html"></iframe>
  </div>

  <script>
    function loadPage(url) {
      document.getElementById("contentFrame").src = url;
    }
  </script>

</body>
</html>

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>在庫管理システム</title>
  <style>
    body {
      margin: 0;
      font-family: sans-serif;
      display: flex;
      height: 100vh;
    }
    .sidebar {
      width: 220px;
      background-color: #2c3e50;
      color: white;
      padding-top: 2rem;
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }
    .sidebar button {
      width: 100%;
      padding: 1rem;
      font-size: 1rem;
      border: none;
      background: none;
      color: inherit;
      text-align: left;
      cursor: pointer;
      transition: background-color 0.2s;
    }
    .sidebar button:hover {
      background-color: #34495e;
    }
    .main {
      flex-grow: 1;
      background-color: #ecf0f1;
    }
    iframe {
      width: 100%;
      height: 100%;
      border: none;
    }
    h1 {
      padding: 1rem;
      margin: 0;
      background-color: #34495e;
      color: white;
      text-align: center;
    }
  </style>
</head>
<body>

  <div class="sidebar">
    <button onclick="loadPage('product.html')">商品マスタ登録</button>
    <button onclick="loadPage('stock_in.html')">入庫登録</button>
    <button onclick="loadPage('stock_out.html')">出庫登録</button>
    <button onclick="loadPage('stock_list.html')">現在庫照会</button>
    <button onclick="loadPage('history.html')">入出庫履歴参照</button>
  </div>

  <div class="main">
    <h1>在庫管理システム</h1>
    <iframe id="contentFrame" src="product.html"></iframe>
  </div>

  <script>
    function loadPage(url) {
      document.getElementById("contentFrame").src = url;
    }
  </script>

</body>
</html>

✅ 利用方法

このファイルを menu_frame.html として保存
product.html や stock_in.html など、各画面HTMLと同じディレクトリに配置
ブラウザで menu_frame.html を開く
左メニューをクリックすると、右側で画面が切り替わります（リロードなし）

「これらの機能」としか言ってないんですが、全機能しっかり読み取ってくれましたね。
onClick時に呼び出されるHTMLファイル名と、フロントエンド作成時に保存しておいたHTMLファイル名が一致しているかを念の為確認しておきます。

まとめ

プロンプトにあいまいな指示が多かったせいかもしれませんが、設計書生成よりもソースコードの生成の方が事細かく生成してくれる印象でした。
各機能が設計内容を網羅していることに加え、メニュー生成にもあるように必要な情報を連携させることにも長けているようです。
どこまで複雑なものに対応できるかが気になるところです。
フレームワークを教えておいて、設計書を読み込ませたら製造完了という状況は、もうすぐ実現しそうな気もします。更に設計書ですら不要で、要件だけで実現ということも有り得そうです。

とりあえず必要なファイルは全て揃ったので、製造編としてはこれで終了します。
次はこれらのファイルを用いて、実際に動作する環境構築を行いたいと思います。