💰 おてつだい給料アプリとは
子どもたちが日々のタスク(お手伝い・勉強・運動など)を達成してポイントを貯め、 2週間サイクルで「お給料」として受け取れるアプリです。 タスクの完了状況に応じて達成率が計算され、基本給料と連動します。
📖 使い方
利用者(子ども)
- ホーム画面で自分のアイコンをタップ
- 今日のタスク一覧が表示される
- タスクを完了したら ⬜ をタップして ✅ にする
- 自分だけのタスクも追加できる(当日限定、デフォルト1pt)
- 「履歴」で日ごとの達成状況と累計ポイントを確認
管理者(保護者)
/adminにアクセスしてダッシュボードを表示- タスク管理: タスクの追加・編集・削除、ポイント数の変更
- ユーザー管理: 利用者の追加・削除、基本給料・ボーナス率の設定
- 目標設定: 月間・年間の目標を各カテゴリごとに設定
- ボーナス: 2週間〜1年単位の達成ボーナス、3ヶ月ごとのボーナス設定
- 過去記録の編集: ユーザー詳細から過去のタスク完了状況を修正可能
🔄 2週間サイクル
このアプリは2週間(14日間)を1サイクルとして運用します。
- サイクル開始日は金曜日
- サイクル終了時に達成率と給料が確定
- 達成率100%超で「オーバーアチーブボーナス」が発生
- 管理者が「次のサイクルへ」ボタンで更新
- 過去の記録は1年間保持
💵 給料の計算方法
基本給料 = 管理者が設定した金額
実際の給料 = 基本給料 × 達成率
ボーナス = (達成率 - 100%) × 基本給料 × ボーナス率
例: 基本給 ¥1,000、達成率 120%、ボーナス率 10% の場合
→ 給料 ¥1,200 + ボーナス ¥20 = 合計 ¥1,220
📂 カテゴリ
📚
勉強
宿題、読書、英語など
🏠
家のこと
掃除、食器洗い、洗濯など
⚽
部活
部活の練習、自主トレなど
🎵
習い事
習い事の練習・宿題
🎨
趣味
創作活動、趣味の時間
🧠
メンタル
日記、家族との会話
💪
ボディ
ストレッチ、外遊び
🛠 技術スタック
| フレームワーク | Hono (JSX SSR) |
| ランタイム | Cloudflare Workers |
| ホスティング | Cloudflare Pages |
| データベース | Cloudflare D1 (SQLite) |
| 言語 | TypeScript |
| スタイリング | CSS (カスタム、フレームワーク不使用) |
| デプロイ | GitHub → Cloudflare Pages (自動) |
🏗 アーキテクチャ
┌─────────────────────────────────────────────┐
│ ブラウザ │
│ ┌──────────────┐ ┌───────────────────┐ │
│ │ 利用者画面 │ │ 管理者画面 │ │
│ │ / │ │ /admin │ │
│ │ /user/:id │ │ /admin/tasks │ │
│ │ /user/:id/ │ │ /admin/users │ │
│ │ history │ │ /admin/goals │ │
│ │ /about │ │ /admin/bonuses │ │
│ └──────┬───────┘ └────────┬──────────┘ │
│ │ HTML Form POST │ │
└─────────┼───────────────────┼─────────────────┘
│ │
▼ ▼
┌─────────────────────────────────────────────┐
│ Cloudflare Workers (Hono) │
│ ┌─────────────────────────────────────┐ │
│ │ routes/public.tsx (利用者ルート) │ │
│ │ routes/admin.tsx (管理者ルート) │ │
│ │ routes/api.ts (APIルート) │ │
│ │ routes/about.tsx (説明ページ) │ │
│ └──────────────┬──────────────────────┘ │
│ │ │
│ ┌──────────────▼──────────────────────┐ │
│ │ lib/db.ts (データベース操作) │ │
│ └──────────────┬──────────────────────┘ │
└─────────────────┼─────────────────────────────┘
│
▼
┌─────────────────────────────────────────────┐
│ Cloudflare D1 (SQLite) │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
│ │ users │ │ tasks │ │ cycles │ │
│ ├──────────┤ ├──────────┤ ├──────────┤ │
│ │completions│ │daily_tasks│ │ goals │ │
│ ├──────────┤ ├──────────┤ ├──────────┤ │
│ │ results │ │ bonuses │ │quarterly │ │
│ └──────────┘ └──────────┘ └──────────┘ │
└─────────────────────────────────────────────┘
📁 プロジェクト構成
task-family/ ├── functions/ │ └── [[path]].ts # Cloudflare Pages エントリ ├── src/ │ ├── index.tsx # Hono アプリ定義 │ ├── types.ts # 型定義・定数 │ ├── components/ │ │ └── Layout.tsx # レイアウトコンポーネント │ ├── lib/ │ │ ├── db.ts # D1 データベース操作 │ │ └── utils.ts # ユーティリティ関数 │ └── routes/ │ ├── public.tsx # 利用者ルート │ ├── admin.tsx # 管理者ルート │ ├── api.ts # API エンドポイント │ └── about.tsx # このアプリについて ├── schema.sql # DB スキーマ ├── seed.sql # 初期データ ├── package.json ├── tsconfig.json └── wrangler.toml