🍱 お弁当管理システム

📦冷凍庫の在庫状況

—個

総在庫数 — / 100個

0▲ 目標ゾーン100

🛒次回注文アドバイス

📅今日の状況

🚚配達中の注文

🍱弁当別在庫数

⚡一括入力（出勤者×弁当）

合計 0個

💡

シフト情報から出勤予定者が自動表示されます。各自の弁当番号を選択してください。
代理入力や不在メモは各行の「📝」ボタンから記録できます。

📋本日の飲食状況

📦在庫管理

💡

個数を直接編集して「在庫を保存」を押すか、「📥 入庫を記録」で到着した注文を一括入庫できます。

表示:

総在庫: 0個

🧮注文アドバイス & 作成

🛒 こだわりシェフで注文する ↗

注文日

現在の総在庫数

1日平均消費数

冷凍庫の残量 — /100個

0▲ 目標ゾーン100

📋注文履歴

📋飲食履歴一覧

🍱お弁当マスタ

👤利用者マスタ

⚙️注文設定

1回の注文数

配達日数・最長（営業日）

早着の目安（営業日）

目標在庫・下限

目標在庫・上限

🗃在庫ボード合計 —個

🔄スプレッドシート連携

🛒 こだわりシェフ — 注文サイト

注文の準備ができたらこちらから注文してください

こだわりシェフで注文する ↗

💡

データをJSONファイルでエクスポートし、Googleスプレッドシートに保存しておくことができます。
HTMLを書き換えた後でも、保存したファイルを読み込めば全データを復元できます。

⬆️ エクスポート（アプリ → ファイル保存）

全データをダウンロードできます。用途に合わせて形式を選んでください。

📦 全データをまとめてダウンロード（推奨）

※ ZIPにはJSON＋各データのCSVが全て含まれます。Googleスプレッドシートへの貼り付けにも使えます。

📄 個別CSVダウンロード

⬇️ インポート（ファイルを読み込んで復元）

保存しておいたJSONファイルを選択してください。ファイルを選ぶだけで自動的にデータが復元されます。

📂

JSONファイルを選択

エクスポートした bento_backup_*.json を選択してください

📊 Googleスプレッドシートとの連携方法

バックアップ：「JSONファイルをダウンロード」でファイルを保存
スプシへ保存：「テキスト形式で表示」→ コピー → スプシのA1セルに貼り付け
HTMLを更新後の復元：保存したJSONファイルを「インポート」で読み込む
スプシから復元する場合：セルの内容をコピー → .jsonとして保存 → 上記手順で読み込み

☁️ GitHub Gist クラウドバックアップ

データをGitHub Gistに保存し、複数端末・複数PCで共有できます。設定方法はGitHub連携ガイドを参照

⬆️ Gistへバックアップ

全データをGistに保存します。毎日の作業後に実行推奨。

⬇️ Gistから復元

クラウドの最新バックアップを読み込みます。

📊 ストレージ使用状況

🗃 過去データのアーカイブ

1年以上前の飲食・注文履歴をアーカイブできます。アーカイブ前にCSVエクスポートが自動で行われます。

🗑 データ管理

※初期化すると全データが削除されます。必ずエクスポートしてからご利用ください。

📈月次レポート & コスト管理

📊月別出庫数推移

💰月別コスト推移

🍱弁当別人気推移（上位5種）

👤利用者別食数・コスト

利用者	部署	食数	金額

🍱弁当別出庫数

弁当名	食数	人気度

🛒注文サマリー

📧月次報告テキスト

上長への報告・メール送信用のテキストを自動生成します。

🔍在庫棚卸し & 自動補正

💡

飲食記録から計算した「帳簿在庫」と実際の在庫数を比較します。差異があれば補正できます。

💡

このページについてスプレッドシートで過去データを整理し、このアプリに読み込むまでの全フローを説明します。
「🔄 過去データ変換ツール」タブを開くと、スプシからのコピペ変換もこのアプリ内でできます。

🗺全体フロー

📋

STEP 1
スプシ準備

✍️

STEP 2
データ入力

🔄

STEP 3
変換ツール

📥

STEP 4
アプリに読込

1

スプレッドシートを準備する

Googleスプレッドシートに以下の形式でシートを作成します。テンプレートCSVを使うと最初から列が揃っています。

📋 弁当マスタシート

A列番号（1, 2, 3…）

B列弁当名

💡 弁当を追加・削除したら番号を振り直してください。この番号が飲食履歴シートの入力値になります。

🍽 飲食履歴シート（マトリクス）

A列利用者名（各行＝1人）

B列〜日付（1列＝1日）

セル弁当番号（マスタ参照）

💡 食べていない日は空欄。右に日付を追加して期間を延ばせます。

🛒 注文履歴シート

A列注文日

B列注文数量

C列ステータス

D列内容メモ（任意）

✅

ステータスの値「入庫済」「注文済」「キャンセル」のいずれかを入力してください。

2

スプレッドシートにデータを入力する

弁当マスタを最初に作り、そこで割り当てた番号を使って飲食履歴を埋めます。

①

弁当マスタシートに番号と弁当名を入力
例: 1=から揚げ弁当、2=ハンバーグ弁当、3=のり弁当…

②

飲食履歴シートのA列に利用者名を入力
田中、佐藤、鈴木… ※アプリの利用者マスタと同じ名前にする

③

1行目に日付を入力（B1から右に）
例: B1=2024/10/01、C1=2024/10/02…

④

各セルに弁当番号を入力
田中の10/01は「2」(ハンバーグ) など。食べていない日は空欄。

3

変換ツールに貼り付けてJSONに変換する

スプレッドシートの各シートのデータをコピーして、変換ツール（このページ内）に貼り付けます。

①

上の「🔄 過去データ変換ツール」タブを開く
このページ上部のタブを切り替えるだけです

②

弁当マスタシートの内容をコピー → 「①弁当マスタ」欄に貼り付け
ヘッダー行（番号・弁当名）は除いてコピーしてください

③

飲食履歴・注文履歴も同様に貼り付け
それぞれのタブに切り替えて貼り付けます

④

「✅ まとめてJSON生成」でダウンロード

4

JSONをアプリに読み込む

変換ツールでダウンロードしたJSONファイルを、スプシ連携ページからインポートします。

①

「🔄 スプシ連携」タブを開く

②

「⬇️ インポート」エリアにJSONファイルをドロップ
または「ファイルを選択」から bento_past_data_*.json を選択

③

完了！ダッシュボードに反映されます

❓よくある質問

名前が一致しないと言われる

変換ツールはアプリの「利用者マスタ」と完全一致で照合します。スプシ側の氏名とアプリの利用者名を揃えてください。スペース・全角半角の違いも影響します。

弁当を追加・削除したら番号が変わった

弁当マスタの番号は変換ツールに貼り付ける時に使います。番号が変わった場合は弁当マスタシートも一緒に貼り付けし直してください。変換ツールはマスタシートと飲食履歴を突き合わせてアプリIDに変換するので、常に最新のマスタを一緒に貼れば正しく動きます。

既存データに追記したい（上書きじゃなく）

インポート時は飲食履歴・注文履歴は既存データにマージ（追加）されます。在庫数のみ上書きです。同じ日付・利用者・弁当の組み合わせが重複した場合は、両方残ります。不要なものは「📋 飲食履歴」ページから削除してください。

日付の形式は何が使えますか？

2024/10/01 または 2024-10-01 の形式が使えます。Excelのシリアル値（数字）も自動変換されます。

☁️

このアプリのクラウド運用について
このアプリは Cloudflare Pages でURL公開し、GitHub Gist でデータをバックアップする構成で運用しています。
このページでは Gistバックアップの設定だけを行います。URL公開・アクセス制限の設定は別途 README を参照してください。

💡なぜこの運用方法なのか

🔒 アクセス制限が無料でできる

Cloudflare Pagesは「許可したメールアドレスの人だけ開ける」設定が無料です。GitHub Pagesでは同じことをするには月額費用が必要です。

👤 職員以外に見られない

URLを知っていても、登録されていないメールアドレスではアプリを開けません。氏名・食事記録などの実データはブラウザ内に保存されており、外部から取得することは不可能です。

💾 データが消えない

データはブラウザ内に保存されます。ブラウザの初期化・機種変更でも、GistにバックアップしておけばいつでもGistから復元できます。

🛡セキュリティの仕組み

このアプリは2段階で守られています。

1

Cloudflare Access（第1の壁）

URLを開くとメールアドレスの入力画面が表示されます。登録済みのメールアドレスでなければ、アプリ画面すら表示されません。ワンタイムコード（6桁の数字）による本人確認が毎回行われます。

2

localStorage（第2の壁）

職員の氏名・食事記録・在庫データは、各自のブラウザ内（localStorage）に保存されています。アプリのファイル自体には含まれていないため、URLを開かれてもデータを見ることはできません。

☁

Gistバックアップの設定（必須）

所要時間: 10分

⚠️

設定しないとデータが消えるリスクがあります
ブラウザの初期化・スマホの機種変更・PCの買い替えが発生した場合、バックアップなしではデータを復元できません。

📋 手順1｜GitHubアカウントを作る

1

https://github.com を開き「Sign up」をクリック

2

メールアドレス・パスワード・ユーザー名を入力して登録

3

届いたメールの8桁コードを入力して認証完了

💡 すでにGitHubアカウントをお持ちの方はこの手順をスキップしてください

🔑 手順2｜バックアップ専用のトークン（鍵）を発行する

トークンとは「このアプリがGitHubにアクセスするための専用の鍵」です。gistの読み書きだけができる最小限の権限を与えます。

1

GitHubにログインして 右上のアイコン → Settings をクリック

2

左メニューを一番下までスクロールして Developer settings をクリック

3

Personal access tokens → Tokens (classic) をクリック

4

Generate new token → Generate new token (classic) をクリック

5

以下のように設定する：

Notebento-backup（何でもOK） ExpirationNo expiration（期限なし） Scopegist にだけチェック（他は全てオフ）

6

Generate token をクリック → 表示された ghp_xxx... の文字列をコピーしてメモ帳に保存

⚠️ このページを閉じると二度と表示されません。必ずメモ帳などに控えてから次に進んでください

✅ 手順3｜アプリにトークンを設定してバックアップを実行する

1

下の「GitHubトークン」の欄に、コピーしたトークンを貼り付けて 「保存」 をクリック

2

「☁️ Gistにバックアップ」 をクリック

3

「✅ バックアップ完了」と表示されれば設定成功

🔑トークンの設定

☁️バックアップ・復元

💡 バックアップは 毎日1回 実行することを推奨します。データはSecret Gist（非公開）として保存されます。

🔧エラーが起きたときは

❌「バックアップに失敗しました」と表示される

原因1：トークンの期限切れ
→ GitHubでトークンを削除して新しく発行し直す。手順2をもう一度行う。

原因2：トークンの貼り付けミス
→ トークンを削除して、メモ帳のトークンをもう一度コピーして貼り付ける。

原因3：データが大きすぎる（5MB超）
→ 「⚙️ 設定」→「アーカイブ実行」で古いデータを削除してから再試行する。

原因4：インターネット接続の問題
→ ブラウザで他のサイトが開けるか確認する。Wi-Fiや有線LANの接続を確認する。

❌「データが消えた・表示されない」

原因1：シークレットモード（プライベートブラウジング）で開いている
→ 通常モードで開き直す。シークレットモードではデータが保存されない。

原因2：別のブラウザ・別の端末で開いている
→ データは端末・ブラウザごとに保存される。Gistから復元する。

原因3：ブラウザのキャッシュ・データを削除した
→ 「🔄 Gistから復元」ボタンをクリックして復元する。

復元の手順：
① 下の「🔄 Gistから復元」ボタンをクリック
② バックアップの日時を確認して「OK」
③ データが復元される

❌「トークンを失くした・忘れた」

トークンは一度しか表示されないため、再発行が必要です。

手順：
① GitHub → Settings → Developer settings → Personal access tokens
② 古いトークン（bento-backup）の「Delete」をクリックして削除
③ 手順2をもう一度行って新しいトークンを発行する
④ このページのトークン入力欄に貼り付けて「保存」

❓「Gistに保存されたデータは誰かに見られる？」

見られません。
バックアップは Secret Gist（非公開） として保存されます。GitHubで検索しても出てきませんし、あなたのGitHubプロフィールにも表示されません。Gistの固有URLを直接知っている人だけが閲覧できますが、そのURLはアプリが内部で管理しているため、通常は外部に漏れません。

❓「トークンが漏れたら何が起きる？」

このトークンは gistの読み書きだけ ができる権限しか持っていません。GitHubのアカウント自体への操作・他のリポジトリへのアクセスは一切できません。

万が一漏れた場合は、GitHub → Settings → Developer settings → Personal access tokens から該当トークンを 即座に削除 してください。削除すると即座に無効になります。

⚠️セキュリティ上の注意点と対策

🔓 注意1｜Secret GistはURLを知っている人なら誰でも閲覧できる

GitHub の「Secret Gist」は検索やプロフィールには表示されませんが、 Gist の固有URLを知っている人は誰でも中身を見られます。 万が一URLが漏れると、バックアップされたデータ（職員名・食事記録など）が見られる可能性があります。

対策：

GistのURLを他人に共有・公開しない
トークンを紛失した・漏れた可能性がある場合はすぐにGitHubでトークンを削除する（Gist URLも変わる）
退職者がいる場合はトークンを再発行してGist IDをリセットする

🔑 注意2｜GitHubトークンはブラウザ内に保存される

このアプリはHTMLファイル1枚で動作するため、GitHubトークンは ブラウザの localStorage（端末内）に保存されます。端末を他人と共有している場合や、ブラウザの開発者ツールを操作できる人には理論上アクセス可能です。

対策：

トークンの権限は gist スコープのみ に限定する（他のリポジトリやアカウント操作はできない）
管理者専用の端末（他人と共有しない）でのみトークンを設定する
端末を廃棄・譲渡する前に「⚙️ 設定 → 全データを初期化」でトークンを含む全データを削除する
不審な点があれば GitHub でトークンを即削除して再発行する

🌐 注意3｜GitHub に送信されるデータは平文（暗号化なし）

ブラウザ〜GitHub間の通信は HTTPS（TLS暗号化） で保護されています。ただし GitHub のサーバー上には JSON の平文（そのままの状態）で保存されます。これは GitHub 社の管理下にある状態です。

現状の安全レベル：

通信経路：✅ HTTPS で暗号化済み（盗聴不可）
GitHub サーバー上：⚠️ 平文保存（GitHub 社は内容を見られる状態）
一般的な社内業務データ（お弁当・食事記録）は、この水準で多くの企業が運用している

📋 より高いセキュリティが必要な場合（バックアップ暗号化について）

Web Crypto API（ブラウザ標準）を使ったAES-GCM暗号化を追加することで、 GitHub上でも暗号化された状態で保存できます。

ただし以下の点を理解した上で選択してください：

パスワードを忘れると 復号が永久に不可能になる
パスワードを全員が共有して管理する必要がある
パスワードの管理が逆にセキュリティリスクになる場合がある

お弁当の食事記録・在庫管理レベルのデータであれば、現状の HTTPS + Secret Gist の構成で多くの用途に対して十分なセキュリティです。氏名・健康情報などより機密性の高いデータを扱う場合は暗号化の追加を検討してください。

✅ 現状の構成でカバーできていること

GistはSecret設定（検索・プロフィールに出ない）
public: false を新規作成・更新の両方で設定済み
トークンはgistスコープのみ（他の権限なし）
通信はHTTPS（TLS暗号化）
全データ初期化でトークンも完全削除される
バックアップデータにトークン自体は含まれない

📅推奨バックアップスケジュール

☁️

毎日：Gistにバックアップ（このページの「☁️ Gistにバックアップ」ボタン）

💾

週1回：JSONファイルをPCに保存（「⚙️ 設定」→「全データをJSON出力」）

📦

月1回：ZIPファイルをPCに保存（「⚙️ 設定」→「ZIPでダウンロード」）

🗂

年1回：アーカイブ実行（「⚙️ 設定」→「アーカイブ実行」）1年以上前のデータをCSV保存して削除

📅 配達予定タイムライン

⬆️ エクスポート（アプリ → ファイル保存）

⬇️ インポート（ファイルを読み込んで復元）

📊 Googleスプレッドシートとの連携方法

☁️ GitHub Gist クラウドバックアップ

📊 ストレージ使用状況

🗃 過去データのアーカイブ

🗑 データ管理

🍱 お弁当を追加

👤 利用者を追加

✏️ 注文内訳を調整する

＋ 注文を手動で追加

📝 代理入力 / 不在メモ

📥 入庫を記録する

📅 有効期限・入庫日を設定

⭐ 弁当を評価する

🔔 通知設定 & 履歴

✏️ 飲食記録を編集

📅 シフト管理

❤️ 好みを手動調整

📋 サイト掲載順を編集

📥 インポート確認 —

＋注文を手動で追加