ChatGPTのエージェントだけでWebアプリを作成する

ChatGPTのエージェントだけでWebアプリを作成する

数日前に、私の環境でもChatGPTのエージェントが使えるようになったので、早速試してみました。

エージェントへの切り替え

ChatGPTのテキスト入力欄の[ツール]から「エージェントモード」を選択します。
Screenshot from 2025-07-27 15-26-34.png

今回は「情報源」として「ウェブ検索」を選択しました。
Screenshot from 2025-07-27 15-25-33.png

プロンプト

プロンプトには、下記を入力して実行してみます。

Ubuntu24.04上で下記の要件のアプリケーションを作成したい。
- Git Hub上にあるDockerイメージを利用
- ITセキュリティに関連する書籍の情報を入力・更新・削除できるWebアプリケーションを作成
- プログラミング言語はPythonを使用
- Pythonとデータベースとのやり取りはORMを使用
- フレームワークを使用してもよい。

応答

約4分後に下記が出力されました。


承知しました。Ubuntu 24.04環境で、GitHub上のDockerイメージを利用し、ITセキュリティ関連書籍をCRUD操作できるPython Webアプリケーションを構築します。ORMを使用してデータベースとのやり取りを行うために、適切なフレームワーク(例:DjangoやFastAPI)とORM(例:SQLAlchemy)の選択を含めた調査を実施します。適切なDockerイメージの確認や実装に進む前に、GitHubで利用できるコンテナの確認を行います。

Worked for 4 分
以下の手順で、指定された要件に合致するITセキュリティ関連書籍の管理アプリケーションを作成し、DockerコンテナとしてUbuntu 24.04上で動作させることができます。FastAPIとSQLAlchemyを採用した理由は、GitHub上のサンプル「python-fastapi-demo-docker」が同様の構成で書籍管理APIを提供しており、FastAPI + Pydantic + SQLAlchemyの組み合わせが高速で柔軟なAPIを構築できる点が評価されているためです
github.com

アーキテクチャ概要

  • フレームワーク:FastAPI(Python)
  • ORM:SQLAlchemy
  • データベース:SQLite(デフォルトで使用。PostgreSQLなどに変更も可能)
  • Dockerベースイメージ:GitHub Container Registryのghcr.io/br3ndonland/inboard(FastAPI向けに最適化されたPython環境)
  • 主要機能:ITセキュリティ関連書籍の登録・一覧表示・更新・削除(CRUD)

FastAPIとSQLAlchemyを使ったサンプルアプリケーションは、本プロジェクトと同じ書籍管理の例に基づいており、データバリデーションにPydanticを利用し、Dockerにより一貫した環境で実行できる構造になっています
github.com

リポジトリの構成

生成したプロジェクトには以下の主要ファイルが含まれています。

ファイル/ディレクトリ 役割
main.py FastAPIアプリケーションのエントリポイント。エンドポイント定義とDB初期化を行う
database.py SQLAlchemyエンジンとセッションの設定
models.py 書籍テーブルのORMモデル定義
schemas.py 入出力用Pydanticスキーマ定義
crud.py CRUD操作を実装
requirements.txt Python依存パッケージ
Dockerfile GitHub上のベースイメージを利用したDocker設定
docker-compose.yml コンテナのビルドと起動を簡略化
README.md セットアップ手順とカスタマイズ方法

セットアップ手順(Ubuntu 24.04)

(1) リポジトリの取得
以下のアーカイブをダウンロードして展開してください。

itsec_books_app.tar.gz

展開後、itsec_books_app ディレクトリに移動します。

(2) DockerとDocker Composeのインストール
Ubuntu 24.04にDockerが未導入の場合は、公式手順に従ってDockerとDocker Composeをインストールします。

(3) Dockerイメージのビルドと起動
リポジトリルートで次のコマンドを実行します。

docker compose build
docker compose up

これにより、GitHubコンテナレジストリにあるベースイメージを取得してアプリをビルドし、ポート8000で待ち受けるAPIコンテナが起動します。\http://localhost:8000/docs にアクセスするとSwagger UIでAPIを試すことができます。

(4) APIの利用

  • 新規書籍登録:POST /books
  • 書籍一覧取得:GET /books
  • 書籍詳細取得:GET /books/{id}
  • 書籍情報更新:PUT /books/{id}
  • 書籍削除:DELETE /books/{id}

カスタマイズ

データモデルは models.py と schemas.py に記載されています。必要な項目を追加・変更することで、出版年、ISBN、カテゴリ以外の情報も扱えます。

database.py の SQLALCHEMY_DATABASE_URL を PostgreSQL の接続文字列に変更し、docker-compose.yml に postgres サービスを追加することで、本番用データベースに切り替えられます。

追加の依存パッケージをインストールしたい場合は、requirements.txt に記述し docker compose build を再実行してください。

このアプリケーションにより、ITセキュリティ関連の書籍情報を効率的に管理・共有できるWebサービスを簡単に構築できます。

なんということでしょう! アプリケーションを作成してtarボールでまとめてくれてます!!
さっそくtarボールを展開し、docker compose buildからdocker compose upを実行してみます。

$ docker compose up
WARN[0000] /mnt/gstone2T_data/Study/python/itsec_books_app/docker-compose.yml: the attribute `version` is obsolete, it will be ignored, please remove it to avoid potential confusion 
[+] Running 3/3
 ✔ Network itsec_books_app_default      Created                            0.0s 
 ✔ Volume "itsec_books_app_books_data"  Created                            0.0s 
 ✔ Container itsec-books-api            Cre...                             0.5s 
Attaching to itsec-books-api
itsec-books-api  | python: can't open file '/app/uvicorn': [Errno 2] No such file or directory
itsec-books-api exited with code 2

みごとにエラってます。
まぁ、1発では人が書いたコードも通常は動きませんよね (ΦωΦ)

このエラーをそのままプロンプトに貼り付けて、エラーを修正してもらって…
これを5回ほど繰り返したところ、エラーなくアプリケーションが動作するようになりました♡

ただし、作ってくれたのは、API部分だけなので、ユーザーが入力するWebページがありません。そこで、下記のプロンプトで、フロントエンドの機能も作成してもらいます。

プロンプト2

`docker compose up`は正常に動作しました。次に、ユーザーが情報を入力・削除・更新するためのフロントエンドのページがないので、その機能を追加してください。

応答2

Worked for 3 分
フロントエンド機能を追加しました。トップページにアクセスすることで登録済み書籍の一覧表示・新規登録・編集・削除が行えるようになっています。フォームではタイトル、著者、出版社、出版年、ISBN、カテゴリ、概要を入力でき、操作後は一覧に戻って更新内容を確認できます。

変更点

  • app/templates ディレクトリを追加し、一覧・新規登録・更新用のHTMLテンプレートを作成しました。
  • app/main.py を修正してルート (/) で書籍一覧を表示し、/books/create と /books/{id}/update のGET/POSTでフォーム入力を処理するようにしました。
  • READMEを更新し、フロントエンドの利用方法やカスタマイズ方法を追記しました。
  • Docker設定やバックエンド(FastAPI+SQLAlchemy)は以前のままです。

更新版のコード一式を以下に添付しますので、再度 docker compose build --no-cache と docker compose up を実行してください。

itsec_books_app_update_frontend.tar.gz

これにより、ITセキュリティ関連書籍の管理をブラウザ上から直感的に行えるようになります。


検証

  • はじめてhttp://127.0.0.1:8000にアクセスしたところ

chatgpt_agent01.png

  • 1冊書籍情報を追加したところ

chatgpt_agent02.png

  • Add New Bookを押して2冊めの書籍情報を入力しているところ

chatgpt_agent03.png

  • 2冊目の入力が終わったところ

chatgpt_agent04.png

  • 「Edit」をクリックして編集しているところ

chatgpt_agent05.png

Deleteもちゃんと動作していました!

今回は、ChatGPTのエージェントだけを使って、簡単なWebアプリケーションを作ってみました(もらいました?)。
これが驚くほど簡単で、「こんなにも手軽にアプリが作れてしまうのか」と感動すると同時に、これからの仕事のやり方が大きく変わっていくことを強く実感しました。
もちろん、すべてが完全自動というわけではありません。ある程度の知識や調整は必要ですが、それでも 「1人で全部やる」から「AIと協力して作る」時代に入った のは間違いありません。

私自身も、これまでのやり方にとらわれず、AIと協力することで生まれる新しい可能性を探っていきたいと思います。

次のファイルは、ChatGPTエージェントが最後に作成したtarボールです。