コスト0円でできる業務改革-送迎予約管理システムのWEBアプリ化
1年間稼働していたGASのシステムを改修して、入出力を「スプレッドシー
ト」から「WEB」に切り替える開発が終了しました。
<< 改修前の記事は下記からご覧ください >>
今回の改修は100%AIがコードを書いています。いわゆるVibe Codiingでアプリ約10個、データベース(シート:約50個)を連携させたシステムです。
開発期間は約5ヶ月(ただし、土日のみ)
コード量は「バックエンド:15,000行、フロントエンド:30,000行」の規模になります。
これくらいの規模のシステムでも、Vibe Coding を活用すれば、非エンジニアでも Web システムを構築できます。
今回は、そのWEBシステムについて公開可能な範囲に絞ってお伝えします。
WEBシステムの概要
1. メニュー画面 & ダッシュボード
各アプリを起動する
5分間隔で各種アラート(電話、増便、シフト)をチェックし表示する
2. 前日予約(CSV)の読込 & 本日分データ作成
前日予約データ(CSV)の読込
本日用のデータ(不要なデータの削除及び短縮名称への変換)
印刷用データ作成(印刷シートへのデータ差し込み、便名毎の人数追加)
3. 各車両毎の印刷データ作成
コース選択 & コース毎の便名データ設定
本日の最新データからコース毎のデータをフィルタリング
便名毎に「乗車場所、降車場所」でソート
印刷用データ作成(印刷シートへのデータ差し込み、便名毎の人数追加)
4. 電話受付の入力(追加、キャンセル、変更)
追加 :「社員番号 or 氏名」から顧客を確定し、「便名、乗車場所、降車場所」を選択する。入力したデータはスプレッドシートに書き込まれ、該当コースのタブレットに自動でメールを送信する。出発時刻が近いものは「電話連絡」のメッセージを表示する。
キャンセル :「便名一覧」から「便名」を選択し、表示された「予約情報」を選択してキャンセル処理をする。後は「追加」と同様の処理を行う。
便変更 :「便名一覧」から「便名」を選択し、表示された「予約情報」を選択する。次に「変更後の便名」を選択して変更処理を行う。後は「追加」と同様の処理を行う。
5. 増便管理
各便毎に1台の車両は設定しているが、「追加、キャンセル、変更」の入力により、増便の必要が生じた場合にはダッシュボードにアラートが表示されるので増便の入力を行う。
増便は「本日分、翌日分」の入力が可能で、「車番、ドライバー」を設定する。
6. シフト管理
月毎に事前に設定されている内容に変更がある場合は「本日、翌日」の変更内容を入力する。
7. タブレット表示
各車両にはタブレットが搭載されているので、このタブレットから種々の情報を閲覧することができる。
各コース別の最新情報
増便情報
全便の乗車状況
その車両に対する「追加、キャンセル、変更」のメール
メールには「OK」ボタンがあり、そのボタンを押すとスプレッドシートに「OK」が書き込まれ、ドライバーが情報を確認したことを記録している。
8. 乗車人数計算(GASのみ)
「追加、キャンセル、変更」があると「乗車人数」の再計算が必要なため、その処理を別途行なっている。ここで、増便の必要性も計算している。
9. 日替わり処理(GASのみ)
基本的に365日稼働しているので深夜の時間帯に日替わり処理を行なっている。
日替わり処理としては「使用済みデータのアーカイブ処理」「本日、翌日の設定」「シフト・増便の設定」などを行い、スプレッドシートのデータを増やさないようにしている
10. 定期実行処理(GASのみ)
5分間隔で定期的にチェックして必要がある処理だけ実行している。
実行時間を短くするために、他のプログでは必要性の有無をスプレッドシートに書き込んで、本プログラムではその内容を参照して実行している。
実行後はスプレッドシートに「実行済」を書き込む。
感想
AIはClaudeを使用してコードを生成し、GASエディタにコピペして動作を確認するという方法で開発しました。
WEB上のエラーはChromeの「検証」画面を表示し、コンソールの内容をClaudeにコピペして修正しています。
開発当時はClaude codeは有料(Maxプラン)しか使用できなかったので使用していません。現在は私が加入している有料(Proプラン)でも使えるので、最近はClaide codeで開発をしています。
Vibe codingによるGAS WEBアプリ開発は最初は最小機能でまず動作するものを作成し、その後は一つずつ機能を追加するのが一番効率が良いように思います。
また、現在だと「Claude code or Codex CLI」も月20ドルで使用可能なので、ある程度本格的にGASを開発する人は「Claude code + clasp」または「Codex CLI + clasp」を使えば、コピペの必要もなくGASエディタで開発する数倍のスピードで開発ができます。
今後の予定
今回の開発で得られたノウハウをより一般的なものに応用したいと思っています。
現在は下記のテーマに対して開発中です。
できれば連携したシステムを開発したいがそれには時間が必要なため、最初は単発アプリが多くなると思います。
名刺OCR
シンプルCRM
介護システムのDX化
