A minimal supplement tracker with daily logging, stats, and gentle nudges.
サプリメントの登録と毎日の記録に特化した、ミニマルな管理アプリ。
English:
Track which supplements you take each day—no accounts to create, no clutter. Get a clear view of your progress, optional low-stock reminders, and a gentle prompt to reconsider supplements you haven’t taken in a while (“Build & Scrap”).
日本語:
サプリを「毎日飲んだか」だけを記録するアプリです。会員登録の手間を抑え、今日の達成率・グラフ・在庫リマインドで続けやすくし、長く飲んでいないサプリには「本当に必要?」と問いかけます。
| Feature | 機能 | Description | 説明 |
|---|---|---|---|
| Register | 登録 | Add supplements with name, amount/unit, timing (optional). | 名前・成分表示・飲むタイミング(任意)で登録。 |
| List & Edit | 一覧・編集 | View, edit, or deactivate supplements. | 登録一覧の編集・無効化。 |
| Daily Log | ログ | Tap “摂取完了” to log intake; toggle to undo. Change date for past entries. | 「摂取完了」で記録。日付変更で過去も記録可能。 |
| Progress | 達成率 | Today’s completion rate and streak (consecutive days with 100% intake). | 今日の達成率と連続達成日数。 |
| Stats & Export | グラフ・CSV | Period-based intake rate and streak; export last year to CSV. | 期間ごとの摂取率・連続達成・過去1年CSV出力。 |
| Supply Reminder | 在庫リマインド | Optional “days left” per supplement; warning when ≤ 7 days. | 在庫あと○日を設定すると、7日以下で表示。 |
| Build & Scrap | ひとつ、問いかけ | Surfaces supplements not taken for several days with a prompt to reconsider need. | 数日記録されていないサプリに「本当に必要?」と表示。 |
| Support | 支援 | Optional donation link (e.g. Stripe Payment Link). | 寄付リンク(任意)で開発支援。 |
| Help | 使い方 | In-app usage guide for first-time users. | 初めて向けの使い方ページ。 |
- Framework: Next.js 16 (App Router)
- UI: React 19, Tailwind CSS 4
- Forms: react-hook-form, Zod (@hookform/resolvers)
- Backend: Supabase (PostgreSQL, Auth with anonymous sign-in, RLS)
- Deploy: Vercel-ready (see SETUP_GUIDE.md)
- Minimal and focused: Only what’s needed to register supplements and log daily intake—no feature bloat.
- Anonymous-first: Uses Supabase anonymous auth so you can start without email signup; data is still per-device/user.
- Gentle accountability: “Build & Scrap” encourages reflecting on whether each supplement is still worth taking.
- Mobile-friendly: Bottom nav, touch targets, and layout tuned for phone browsers (and optional same-WiFi access from PC IP).
- Documentation: Setup, deployment, donation link, and monetization are documented in markdown (SETUP_GUIDE, DEPLOY_VERCEL, MONETIZATION_PLAN).
- Node.js 18+
- Supabase project with tables and RLS (run
supabase-schema.sqlin SQL Editor) - Enable Anonymous sign-in in Supabase: Authentication → Providers
# 1. リポジトリをクローン(既にある場合はスキップ)
git clone <your-repo-url>
cd SupplementApp
# 2. 依存パッケージをインストール
npm install
# 3. 環境変数ファイルを作成
cp .env.example .env.local.env.local を開いて Supabase の値を設定します(Supabase → Settings → API から取得):
NEXT_PUBLIC_SUPABASE_URL=https://xxxxx.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key_here
# 任意: 寄付ページ用 Stripe Payment Link
# NEXT_PUBLIC_STRIPE_DONATION_LINK=https://buy.stripe.com/...# 4. 開発サーバーを起動(ポート 3001)
npm run devブラウザで http://localhost:3001 を開きます。
同一 Wi‑Fi の別デバイスからアクセスする場合: http://<PCのIPアドレス>:3001
注意:
.env.localを変更した後は開発サーバーを再起動してください。
- In Supabase, run
supabase-schema.sqlin the SQL Editor (creates tables and RLS). - If the app was used before the supply feature: run
supabase-migration-supply.sqlonce to add thesupply_days_leftcolumn.
| File | Content |
|---|---|
| SETUP_GUIDE.md | Step-by-step: donation link (Stripe) and Vercel deployment |
| DEPLOY_VERCEL.md | Vercel deploy and environment variables |
| MONETIZATION_PLAN.md | Freemium and monetization plan |
| PLAN.md | Roadmap and phases |
From the project root (e.g. SupplementApp/), run:
chmod +x deploy.sh
./deploy.shRequires GitHub CLI installed and logged in (gh auth login). The script: initializes Git (if needed), creates a public repo with the same name as the folder, commits all files with feat: initial commit, and pushes to main.
MIT (or specify your preferred license).