- 概要
- 日常の節約を“我慢の可視化”によって習慣化することを目的に開発した個人アプリ。Next.js(App Router構成)とSupabaseを用いて、認証・データ管理・グラフ表示などを実装。React Hook FormやZodを活用し、入力バリデーションやユーザー体験を重視した設計。UI/UXデザインにも注力し、モバイル中心の直感的な操作性を追求。
- ターゲット
- 節約意識はありながらも貯金を継続することが苦手な、20〜30代の一人暮らし社会人を想定。
- 課題
- 自分自身、貯金を習慣化することが苦手で、続けられる仕組みがほしいと感じていた。既存の家計簿アプリは数多くあるものの、どれも継続できなかった。原因は「貯金の習慣化」にあると考え、日々の我慢を可視化できるアプリを開発した。
- 目的
- 日常の中で我慢した支出を“見える化”することで、貯金を楽しみながら習慣化できる仕組みをつくること。
- 主な機能
ユーザー認証(ログイン・サインアップ)
Supabase Authで認証管理を実装。
目標設定機能
目的・金額・期限を登録し、達成率を表示。
我慢記録の登録
金額・カテゴリ・メモを入力して記録。
進捗グラフ表示
円グラフ・棒グラフで貯金の推移を可視化。
- 今後の更新
PC画面へのレスポンシブ対応
PCでも快適に操作できるレイアウトへ最適化。
フォルダ管理機能の追加
目標ごとに記録内容を整理できるフォルダを作成。
達成バッジ機能の実装
貯金額や記録日数に応じてバッジを付与。
カテゴリー追加機能
ユーザー自身でカテゴリーを作成・編集可能に。
ダークモード対応
好みに合わせて配色を切り替え可能に。
- 使用技術
- Next.jsReactTypeScriptTailwindSassSwiper
- 使用ツール
開発支援
Chrome DevToolsTerminal (zsh)ESLintPrettier
- デモアカウント
mail address:
demo@demo.com