← Worksへ戻る

StockSnap

トイレットペーパーや洗剤など家庭の日用品在庫を入出庫履歴から管理し、発注点を下回った商品については Claude APIが購入数量・緊急度・コメントを提案するAIアシスタントアプリです。

  • 日用品在庫管理
  • AI発注提案
  • ダッシュボードUI
実際のサイトを見る ↗

概要

家庭の日用品は「まだあると思っていたら切れていた」「気づいたら買いすぎていた」ということが起きやすく、 食材以上に在庫の把握が後回しになりがちです。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で実装しています。