Aiと一緒にツールを作ってみよう(機能作成編)

はじめに

この記事は前回(https://qiita.com/92yuki/items/948e67d907b4576a1434)
の続きになります

この記事でやったこと

今回は前回の続きとして、実際にSpring Bootを起動し、

• 画面を表示する
• PostgreSQLと接続する
• DBからイベント情報を取得する
• ブラウザからイベントを登録する
• 登録したイベントを削除する
  の主に5点を実施しました
  なお、今回もCodexとChatGPT(以下GPT)にかなり助けてもらいながら進めています。

画面を表示する

まずはブラウザ上に、Codexで作成したページがそもそも存在するか、画面表示がしっかりできるかなどを確認します。

PostgreSQLと接続する

PostgresのことについてはOSS-DBを取得したためなんとなくわかりますが、
外部との連携となると話は別です。
どうすればいいかをGPTに尋ねると、以下のような回答が

他にも「application.properties にDB接続設定を書く」、「GameEvent Entityを作る」などを教えてもらいつつ、それらをCodexに投げて実装してもらいます。

PostgresにJavaプロジェクト側が接続できない

しかし、ここで問題発生です
「authentication failed」エラーが出てしまい、接続ができませんでした。
ただし、ここもGPTにエラーを投げつつ、最終的に解決。
原因はPostgreSQLへの接続時のパスワードを、セキュリティのためにあえて直書きを避けてサーバー起動時に毎回入力するようにしていたのですが、その部分の環境変数の設定がうまくいっていないことでした

#実際の起動時コマンド
#1行目:実行後にパスワードを訊いてきて、その際に入力した文字列を"$postgresPassword"変数に代入
$postgresPassword = Read-Host "PostgreSQL password" -AsSecureString

#2行目:"$postgresPassword"にあるパスワードを"$DB_PASSWORD"に代入する
$env:DB_PASSWORD = [System.Net.NetworkCredential]::new("", $postgresPassword).Password

#3行目:springbootを実行
.\mvnw.cmd spring-boot:run

問題となったのは2行目で、"\$DB_PASSWORD"にパスワードを代入できたまではよかったのですが、
これをさらに受け取るapplication.properties側では"$DB_PASSWORD"を待ち受けておらず、
結果としてパスワードはあっているのに、認証が通らないという事象でした。

DBからイベント情報を取得する

実際に接続自体はできたため、DBを作成
マスタテーブルと実際に画面に表示するためのテーブルを作成し、実際に表示してみます

(テーブル作成などについては自身で作成)

その後実際にspring bootを起動
URLを入力して画面表示させます

画像の通りしっかりと出すことができました。
大部分がAIに作らせていますが、それでも自分の作ったものが想像の通り出てきてるのを見ると嬉しいものです。

ブラウザからイベントを登録する

さらにAIに実装を依頼しつつイベントの登録画面を作成

登録ボタンを押下すれば登録も完了

DBにもちゃんと反映されていることまで確認できました。

登録したイベントを削除する

さらに、登録したものを削除する機能も実装し、最低限の機能は実装できました

おわりに

まとめ

今回はSpring Bootを実際に起動するところから始めて、

• PostgreSQLとの接続
• DBに登録したイベントの一覧表示
• ブラウザからのイベント登録
• 登録したイベントの削除

まで実装することができました。
今後は画面からレコードの編集機能や、画面上の日時の表示の修正などの実装。
またAIに特定のタイトルのイベントページを見つけてもらい、それをテンプレートとして半自動で登録(またはDBにINSERTするなど)をしていきたいため、まだまだアプリとしてはかなり簡素です。
それでも、最初は何もなかった画面にDBのデータが表示され、ブラウザから登録した内容が実際にPostgreSQLへ保存されているところまで確認できると、ようやく「Webアプリを作っている」感が出てきました。
また、今回は途中でPostgreSQLへの認証エラーにも遭遇しましたが、エラー文をGPTに確認しながら原因を切り分けることで解決できました。

AIに一発で全部作らせれば楽……ではあるけど

ここまでDBのテーブル以外は大体の部分をAIに実装させ、かつそれをAIに解説させつつ製造をしていきました。
AIのため「こういう機能をを作って」と投げれば一発です。
ですが「なぜこの処理が必要なのか」「今どことどこがつながっているのか」を逐次Aiに分割しつつ出してもらうことで、
この進め方がどこまで身につくのかはまだ分かりませんが、少なくともAIに完成品を丸ごと出してもらうよりは、中身を確認しつつ作れている実感があります。

次回は、まだ実装していない編集機能や表示周りの改善を進めつつ、最終的にやりたい「公式サイトからイベント情報を取得して一覧化する」機能にも少しずつ近づけていきたいと思います。