GASで簡易的な予約システムをスプレッドシートで実現する方法

こんにちは、GASおじです。今日はGoogle Apps Script(GAS)を使って、簡易的な予約システムをスプレッドシートで構築する方法をお教えするぞ。SaaSの月額課金に毎月頭を悩ませているあなたに是非オススメだ。中小企業の経営者やフリーランスの方々にとって、固定費の削減は利益に直結するからな。
何故GASで予約システムなのか
まず、既存の予約管理ソフトを使えば手間はかからんが、月額費用が馬鹿にならない。例えば、1ユーザーあたり月3000円程度の料金だとしても、年にすると36000円だ。10人の従業員が居れば、なんと年間36万円だよ。これをGASでゼロ円にできれば、その分を他に回せるって話だ。
GASで予約システムを作る基本
まずはGoogleスプレッドシートに以下のような表を作成してくれ。
- 予約日時
- 氏名
- 連絡先
- 用件
シートに頭文字を使って「予約」「氏名」「連絡先」「用件」のラベルを一行目に入力しろ。そして、このデータを基に管理するGASを組んでいくぞ。
GASコードの実装
以下のコードをGoogle Apps Scriptに貼り付けてくれ。今回は簡易的な入力フォームを作るぞ。
function doGet(e) {
const htmlOutput = HtmlService.createHtmlOutputFromFile('index');
return htmlOutput;
}
function submitData(form) {
const sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('Sheet1');
sheet.appendRow([form.date, form.name, form.contact, form.purpose]);
return '予約が完了しました!';
}
次に、index.htmlファイルをプロジェクト内に作成し、以下のHTMLコードを書こう。
<!DOCTYPE html>
<html>
<body>
<form id="form">
日時: <input type="datetime-local" name="date" required><br>
氏名: <input type="text" name="name" required><br>
連絡先: <input type="tel" name="contact" required><br>
用件: <input type="text" name="purpose" required><br>
<input type="button" onclick="submitForm()" value="予約">
</form>
<script>
function submitForm() {
const form = document.getElementById('form');
const data = {
date: form.date.value,
name: form.name.value,
contact: form.contact.value,
purpose: form.purpose.value
};
google.script.run.withSuccessHandler((msg) => {
alert(msg);
form.reset();
}).submitData(data);
}
</script>
</body>
</html>
実際の運用と利点
この予約システムは非常にシンプルなものだが、あなたのビジネスニーズに併せてカスタマイズも可能だ。メール通知を付け加えたり、アクセスコントロールを強化したりすることで、さらに便利になる。肝心なのは、このカスタムソリューションが"タダ"で手に入るってことだ。
最終的にどれくらいのコスト削減?
仮に5人の従業員がいて、毎月1万円の予約管理ツールを使っていた場合。0円になるSwitchで年間12万円のコストカットだ。少なくとも、蛙の子は水に落ちず。GASを使えば、解決できることがまだまだあるってわけさ。
少しでも興味を持たれたあなたには、更なる便利ツールを揃えているGASおじラボのメンバーシップをお勧めするぞ。是非、覗いてみてくれ。