← 実績一覧へ戻る
CLIENT WORK

店舗スタッフ管理システム
OpsBoard

シフト・バック・棚卸しを1画面に。飲食店2店舗のスタッフ業務を一元管理する、本番運用中のWebシステムです。スマホからでも使えるレスポンシブ設計で、管理者とスタッフそれぞれに最適化したビューを提供します。

Next.js 15 TypeScript Tailwind CSS Supabase (PostgreSQL) NextAuth.js Vercel

店舗運営の日常業務を、1つの画面に

シフトの希望提出から確定、出退勤の記録、売上バックの申請・承認、月末の棚卸しまで——飲食店2店舗の「毎日の運営業務」をこのシステム1つで完結できます。管理者・社員・アルバイトの3段階の権限で、それぞれに必要な画面だけが表示されます。

ダッシュボード 店舗管理 スタッフ管理 シフト管理 勤怠管理 バック管理 棚卸し管理

実装スコープ

シフト管理(希望提出・確定・カレンダー表示)
バック管理(記録入力・承認フロー・月次集計)
スタッフ管理(氏名・時給・役職・権限)
棚卸し管理(在庫品目・数量入力・履歴)
店舗管理(複数店舗対応・営業情報)
ダッシュボード(自分のシフト・バック集計)
3段階権限制御(管理者 / 社員 / アルバイト)

設計・実装で工夫した点

3段階権限制御(サーバーサイド二重チェック)

管理者・社員・アルバイトの権限を NextAuth.js セッションで管理し、ページアクセス時はサーバーサイドでも権限を検証。フロントの非表示だけでなく API レベルでも保護しています。

楽観的ロックによる同時編集競合防止

複数の管理者が同時にシフト確定操作を行っても上書きが発生しないよう楽観的ロックを実装。競合時はユーザーに警告を表示します。

バック承認フロー

アルバイトが入力したバック記録は「申請中」として扱い、管理者が承認した時点で初めて月次集計に反映。不正記録を防ぎつつ記録の手間を下げました。

複数店舗対応アーキテクチャ

シフト・バック・棚卸しはすべて店舗IDに紐づけて管理。新店舗は管理画面から追加するだけで各機能が独立して動作するよう設計しています。

← 実績一覧へ戻る