StockSnap
トイレットペーパーや洗剤など家庭の日用品在庫を入出庫履歴から管理し、発注点を下回った商品については Claude APIが購入数量・緊急度・コメントを提案するAIアシスタントアプリです。
実際のサイトを見る ↗概要
家庭の日用品は「まだあると思っていたら切れていた」「気づいたら買いすぎていた」ということが起きやすく、 食材以上に在庫の把握が後回しになりがちです。StockSnapは入出庫の履歴を積み上げて現在庫を算出する設計により、 発注点を下回った商品を自動で検知し、Claude APIが過去の消費ペースから購入数量・緊急度・アドバイスコメントを 提案することで、買い忘れと買いすぎの両方を防ぐことを目指したアプリです。
主な機能
入出庫履歴による在庫管理
購入・消費・調整などの入出庫履歴(stock_movements)を積み上げ、現在庫はビュー(stock_levels)で都度集計する設計。在庫数そのものを直接書き換えないため、履歴の整合性が崩れにくい。
発注点による要購入判定
商品ごとに設定した発注点を現在庫が下回ると「要購入」として一覧上にステータス表示し、買い忘れに気づきやすくする。
Claude APIによる発注提案
直近30日の平均消費数・在庫切れまでの推定日数をClaude APIに渡し、Tool useで購入数量・緊急度(low/medium/high)・日本語コメントを構造化データとして取得、履歴として保存する。
ワンタップ在庫ステッパー
一覧上の「-/+」ボタンで入出庫をその場で記録。API応答を待たずに表示を先に増減させる楽観的更新で、体感速度を向上させている。
レスポンシブダッシュボード
同じ商品データをPC向けのテーブルとスマホ向けのカードの両方に描画し、CSSメディアクエリで表示を出し分けるフロントエンドフレームワーク未使用のシンプルな構成。
商品追加モーダル・入力アシスト
商品名入力欄にdatalistで既存商品名をサジェスト表示し、選択すると対応するカテゴリを自動反映。新規商品は初期在庫数を指定して登録できる。
工夫したポイント
在庫データはORMを使わずpsycopg(生SQL)で扱い、入出庫履歴を積み上げて現在庫をビューで都度集計する設計にすることで、 在庫数の直接更新による不整合を防いでいます。AIへの提案依頼はTool useを強制する形で呼び出し、 数量・緊急度・コメントのスキーマを保証することでレスポンスのパース処理をシンプルに保ちました。 画面側もアプリの規模に対して過剰にならないよう、状態管理ライブラリ等は導入せず素のHTML/CSS/JavaScriptで実装しています。