ChatGPTと一緒に作る！サウナ検索アプリ開発のはじめかた
こんにちは。今回は、ChatGPTを活用して「サウナ検索アプリ」を開発して遊んでみたので、その時の体験をまとめてみました。
今回の記事では、全くの０の状態からどんなアプリを開発したいのか、
要望➝要求➝要件
を固める方法が分かります。
こんなアプリを作ってみたい！
アプリ名：サウナ検索アプリ
以下のような機能を目指しました：
- 地域・サウナ温度・水風呂温度を入力して検索
- 条件に合ったサウナ施設を画面左側に一覧表示
- 検索にヒットしたサウナは画面中央のGoogleMapにピン刺しで表示
- 一覧にはサウナに関する詳細表示
ChatGPTで要件定義をつくってみた
最初にやったのは、アプリの要件定義をChatGPTに投げることでした。
実際のプロンプト例：
本スレッドは、プログラミングについて記載していきます。
下記のようなアプリを作りたいです。■要件定義
概要
・題名：サウナ検索アプリ
・内容：ユーザが入力した地域・サウナ温度・水風呂温度に合致したサウナを一覧表示するアプリ■詳細
・画面
- 画面上に「地域」と、「サウナ温度」と、「水風呂温度」入力用のテキストエリアが用意されており、
各項目（必須ではない）を入力後、「検索」ボタンを押下すると、
上記に合致したサウナ施設の一覧を画面上に表示。
また、一覧表示された各項目をクリックすると、
そのサウナ施設のサイトへ遷移。
・検索処理- 「地域」に関しては４７都道府県で検索処理。
- 「サウナ温度」は○○℃以上で検索処理。
- 「水風呂温度」は〇〇℃以下で検索処理。
■開発環境
下記のいずれかの環境で開発予定
【OS】
・Windows11
・Linux
【言語】
・TypeScript
・Java
・JavaScipt
・Python
・SQL
・HTML
・CSS
・JQuery
【FW】
・Angular
・Selenium
・Spring Boot
【DB】
・MySQL
・DynamoDB
【その他】
・Apache Tomcat
・Node.js
・TortoiseSVN
・JMeter
・Eclipse
・Visual Studio Code
・AWS
ChatGPTからの実際の回答：
サウナ検索アプリ、面白そうですね！
検索条件に「サウナ温度○○℃以上」「水風呂温度○○℃以下」があるので、データベースには最低限、各施設の温度情報を持つテーブルが必要ですね。ざっくり設計イメージ
フロントエンド（Angular）
- 地域・サウナ温度・水風呂温度の入力欄＋検索ボタン
- 検索結果を一覧表示し、クリックで施設のサイトに遷移
バックエンド（Spring Boot + MySQL）
- フロントエンドからの検索リクエストを受け取り、DBから条件に合う施設を検索
- APIエンドポイントを用意して、JSON形式でデータを返す
データベース（MySQL or DynamoDB）
- サウナ施設テーブル（id, 名前, 地域, サウナ温度, 水風呂温度, 公式URL など）
いくつか検討ポイント
- サウナ施設のデータをどうやって収集するか？
既存のAPIがあるなら利用、なければ手動 or Webスクレイピング（Selenium）も視野に- DynamoDBとMySQLのどちらを使うか？
DynamoDBならAWSとの相性がいいし、MySQLなら使い慣れてるなら管理しやすい- 検索処理のパフォーマンス
施設数が増えると検索が重くなる可能性があるので、インデックスやキャッシュを検討どんな感じで進めたいですか？技術選定や具体的な設計も一緒に考えますよ！
このように、あいまいなアイデアでもChatGPTが整理してくれます。
使用技術スタック
現在の開発環境は以下の通りです：
- フロントエンド：React or Angular（検討中）
- バックエンド：Spring Boot（Java）
- DB：MySQL
- スクレイピング：Java + Selenium（例：サウナイキタイ）
- API：Google Maps API
- その他：Eclipse, VSCode, AWS, Tomcat など
例：ChatGPTにこんなふうに聞いてます
- 「Spring Bootで地域と温度を使って検索するAPIを作りたい。構成とコード例を教えて」
- 「Reactでフォームを作って、APIを叩いて結果を一覧表示したい」
などなど、技術ごとの相談もかなり強力です。
ChatGPT活用Tips
| やりたいこと | ChatGPTへの質問例 |
|---|---|
| 要件定義 | 「○○を実現するにはどんな機能が必要ですか？」 |
| 画面設計 | 「Reactで検索フォームを作りたい。構成例は？」 |
| バックエンド設計 | 「Spring BootでAPIを作る構成を考えて」 |
| スクレイピング | 「Jsoupでサウナ温度を取得する方法を教えて」 |
まとめ：ChatGPTは“開発パートナー”になる
結論：
ChatGPTは、コードを書く「ツール」として有能なだけでなく、
一緒に考えてくれる“共創パートナー”として最強だと感じました。
筆者はAWSとGoogleAPIを用いて途中までサウナ検索アプリを開発しましたが、
両方とも有料で年間で維持するだけでも３万円以上かかりそうだということが判明したので、断念しました。
ただ、ReactやAWSやGoogleAPIについて全く知らない状態からのスタートでしたが、
下記の実装まではChatGPTと対話することで楽しかったので２～３日ほどで進められました。
楽しく開発できるところが一番大きかったかも。
実装内容：
React(画面)：検索ボタン押下後、AxiosでJavaへリクエスト
↓
Java(バック)：リクエストの地名＋サウナでAPIを叩き詳細情報を取得
↓
Java(バック)：上記API取得情報と、DBからSQLで取得した結果を特定の条件で絞り込み取得
↓
React(画面)：上記レスポンスを整形して画面へ描画
その他：
正直、実装より大変だったのは、
AWSの環境構築やAPIの疎通方法など情報がころころ変わる内容について調べる点などでした。
ChatGPTに聞いても正確な答えが返ってこない時もありましたが、
日にちをまたいで再度具体的に聞いてみるとうまくいくこともありました（一日に何度もプロンプト投げると同じような回答しか返ってこなくなる？）。
