09

RECRUIT · FORM AUTOMATION

TechBridge採用フォーム自動化

カテゴリ

採用LP / フォーム自動化デモ

技術

HTML / CSS / GAS / Google Sheets / Gmail

デプロイ

GitHub Pages

ステータス

LIVE

概要

架空のテック企業「株式会社テックブリッジ」の採用LP + 応募フォーム自動化デモです。エンジニア採用を想定したランディングページに、Google Apps Script(GAS)を使った自動化バックエンドを組み合わせました。

応募フォームを送信すると、応募内容がGoogleスプレッドシートに自動記録され(TB-0001と自動採番)、応募者へ受付完了メールが即時送信されます。「LP制作」と「業務自動化」の両方をひとつのデモで見せることを意識しています。

自動化フロー

  • フォーム送信 — 氏名・フリガナ・メール・電話・現在の状況・希望ポジション・ポートフォリオURL・自己PRを入力して送信
  • GAS(doPost)受信 — WebAppとしてデプロイしたGASがPOSTを受け取る
  • スプレッドシート記録 — 「採用フォーム 応募者管理」シートに自動追記。TB-0001、TB-0002…と連番IDを付与。ステータスは「書類選考中」で初期設定
  • Gmail自動返信 — 応募者に受付完了メールを即時送信(差出人名:株式会社テックブリッジ 採用担当)
  • 成功画面表示 — フォームが完了画面に切り替わる

技術構成

  • HTML / CSS / JS — フロントエンド(フレームワークなし)
  • Google Apps Script — バックエンド(WebApp / doPost)
  • SpreadsheetApp — 応募データの記録・採番・ヘッダー自動生成
  • GmailApp — トランザクションメール送信
  • GitHub Pages — フロントのホスティング

こだわり

  • GASコードをMonaco Editor API(setValue)で直接注入して確実に保存する実装を習得
  • ヘッダー行の初期化・自動採番・列幅の自動調整をGAS側で完結させ、手動セットアップをゼロに
  • スプレッドシートのヘッダーを太字+ブルー背景で自動スタイリング
  • エンドツーエンドのテスト(フォーム送信 → シート確認 → メール受信)で動作確認済み