ブラウザだけで動く、ただ日付と体重を入力するだけでシンプルな「体重管理 App」を作成してみました。
この記事では、ツールの基本的な使い方から、知っておくと安心なデータ管理・バックアップ方法までを分かりやすく解説します。
1. 初期設定
ツールを初めて使用する際の手順です。まずは以下の設定を行いましょう。
- 設定画面へ移動：画面右上「設定/CSV」ボタンをクリック
- 身長と目標体重を入力：「設定＆データ管理」画面で「身長(cm)」と「目標体重（kg）」を入力
- 設定の保存:「基本設定を保存」ボタンをクリックして、初期設定を保存します
2. 基本的な使い方
ツールのメイン機能を使用する際の大まかな流れです。
2-1. 体重を入力
ホーム画面で、「体重（kg）」を入力して、「記録する」ボタンをクリックするだけです。
3. 各項目の簡単な説明
画面上に表示される主な項目とその役割の一覧です。
| 項目名 | 説明 |
|---|---|
| ダッシュボード | 現在のBMI・目標体重までの差・平均減量ペース・目標達成までの予測期間などを確認できます |
| 体重推移グラフ | 折れ線グラフで推移を確認できます。 |
| 記録履歴一覧 | 入力した体重の履歴を確認できます。 修正削除もここで行えます。 |
| 設定/CSV | 目標体重の設定ができます。 データをCSVで出力も可能＝このデータがバックアップになります。（このデータをインポートも可能） |
ダッシュボード
現在のBMI・目標体重までの差・平均減量ペース・目標達成までの予測期間などを確認できます。
体重推移グラフ
折れ線グラフで推移を確認できます。
目標体重や標準体重（BMI）も確認できます。
日次・週次・月次・年次に切替も可能で、ダッシュボードの平均ペースの内容も切り替わります。
記録履歴一覧
入力した体重の履歴を確認できます。
年月日項目をクリックすると、入力した体重の修正・削除を行えます。
設定/CSV
目標体重の設定ができます。
データをCSVで出力も可能＝このデータがバックアップになります。
出力したCSVファイルをインポートすることも可能（重複したデータは上書きされます）
4. データの保存先
入力した体重データは、「あなたの端末(PC・スマホ)のウェブブラウザに保存」しています。
※本サイトのサーバーには保存していません。(そんなデータ使い道無いのでいりません)
具体的には「IndexedDB」に保存しています。
したがって、ブラウザのキャッシュが削除してしまうと削除される可能性があります。
5. キャッシュ削除前のバックアップ方法
ブラウザの閲覧履歴やキャッシュを削除すると、ローカルに保存されたデータが消えてしまう場合があります。定期的なバックアップを推奨します。
5-1. バックアップの手順
エクスポート画面を開く: 「設定/CSV」をクリック
データをダウンロード: 「CSVエクスポート」ボタンをクリック
データを確認: ファイルをPCやスマホに保存します
5-2. データの復元（リストア）手順
インポート画面を開く: 「設定/CSV」をクリック
データをインポート: 「CSVインポート」ボタンをクリック
データを選択:事前に保存していたCSVファイルを選択します
まとめ
この体重管理アプリは、ぬくぬく自身が
超面倒くさがり
でも成果は見える化したい
このままの生活で、いつ頃になったら目標体重になれるのか見通しが知りたい
という３点のみに注視したアプリになっています。
私のように、なるべく手間をなくして、成果と予測を一目で確認したい人は、ご活用いただけますと幸いです。
以上
