QRコード1枚で注文からセルフ会計まで完結
テーブルのQRコードを読み取るだけでセルフ注文が完結。トップページからスタッフログインと顧客デモメニューの双方へ導線を用意しています。
トップページ — スタッフログインと顧客デモメニューへの導線
スタッフ — ログインから注文速報まで
店舗コード・スタッフID・PINの3要素でログイン。ダッシュボードでは進行中注文をカード形式で表示し、10秒ごとの自動ポーリングで最新注文を取得します。
ログイン — 店舗コード・スタッフID・PINで認証
注文ダッシュボード — 卓ごとの注文をカード表示・10秒自動更新
テーブル管理 — 明細修正・QR発行・会計をワンストップで
左ペインで卓を選択すると、右ペインに全注文明細が展開。数量の増減・保存・卓単位会計への導線・QRコード発行が1画面で完結します。
テーブル管理 — 卓の注文明細とQRコード発行を同一画面で管理
管理者・顧客 — それぞれに最適化された画面
管理者はPCからカテゴリ並び替え・商品トグル・スタッフ管理を即時反映。顧客はスマートフォンでQRを読み取り人数を入力するだけでメニューへアクセスできます。
管理者画面 — カテゴリDnD・商品の表示/売切/在庫トグルを即時反映
顧客チェックイン — 人数・年齢層を選択してメニューへ
採用したシステム構成
Next.js 16 App RouterTypeScriptTailwind CSS v4Prisma 7iron-sessionSQLite (開発)PostgreSQL (本番)Vercel
リリース期間
約6週間
要件定義・設計2週間 / 実装3週間 / テスト・調整1週間
実装範囲と機能
顧客向けチェックイン・メニュー・カート・注文確定（スマホ最適化）
同一卓の複数端末で注文履歴共有（卓セッショントークン）
スタッフ向け注文ダッシュボード（10秒自動ポーリング）
テーブル管理（明細修正・QR発行/終了・卓会計導線）
管理者向け商品管理（カテゴリDnD・各種トグル即時反映）
店舗設定・スタッフアカウント管理
iron-session による HttpOnly Cookie セッション認証
ADMIN / STAFF ロール制御（API二重チェック）
顧客・スタッフ・管理者の3ロールをすべて単一アプリで実現。卓セッション管理（固定QR運用対応・会計後の無効化）・PINハッシュ化・ロールベースAPIガードなど、実運用を意識したセキュリティ設計を採用しています。