見出し画像

【GAS】自作したWEBアプリで家計簿をつけてみよう~”どこでも!”家計簿アプリ 動的2週間振り返り目次付きver”

ここで挙げる記事のシリーズでは、GASで「テーブル形式フォーム」を使ったWEBアプリを作り、日常を少しばかり便利にする例をご紹介しています。

ここでテーブル形式フォームと称しているものは、WEBページを介して、スプレッドシートをインタラクティブに読み書きできるテーブルのことで、以下の記事では「どこでも帳簿」としてご紹介しています。

これに少しばかり機能を付加すると、色々な用途に使えるWEBアプリになります。ひとつの例として、WEBページから読み書きできる家計簿への利用例を、以前記事にしました。

この記事でご紹介しているWEBアプリは、「テーブル形式フォーム」から、スプレッドシートに書き込む先のシートを複数化したもので、入力ボックスから日付を指定すると、スプレッドシート側では、指定した名前のシートが読み書きできる様になるというものです。


たとえば、2020年11月21日、と指定して、読み書きすると、・・・・


・・・・スプレッドシートの、2020年11月21日 のシートにデータが書き出されます。

これを利用することで、日別に帳票に書き込める家計簿アプリを作っています。

家計簿ソフトは世に沢山ありますが、端末を問わず、インストールしなくて使用できるWEBアプリという形は、家計簿という、こまごまとした入力が必要な用途にぴったりだと考えています。

今回の記事では、この「どこでも家計簿」を少し改良して、2週間分の目次を動的に作成し、同時に2週間分の記帳結果を振り返ることができる様にしたものをご紹介します。


動的2週間振り返り目次とは

この記事でご紹介する「動的2週間振り返り目次」とは、以下の様な機能を持ったWEBページ上の目次です。

外観

以下がアクセスした状態で、当日(本例では1月8日)を含む週と、その前の週の日付が表示されています。また、当日の日付は黄色くなっています。(WEB画面では点滅しています)

目次の表には、追加情報として、日付の下に、日別の支出合計値が表示されています。

これを見ると、今週と先週の支出額を振り返る事ができます。

日付をクリックすると該当シートが表示される

日付はリンク文字となっていて、クリックすることで、該当日の帳簿が表示されます。例えば「01/03」をクリックしてみましょう。


すると、上記の様が画面が表示されました。これを見ると、この日の支出150円の内容が分かりますね。


日別の帳簿を修正すると目次の支出額に反映される

いま、たまたまこの日の記入漏れがあって、改めて追加費用を記入したとします。

ここでは、200円も記帳もれがあったので追加しました。結果として、日別の支出が150円⇒350円になりました。


「書込み」ボタンを押したら、ブラウザの「←(戻る)」ボタンなどを押して目次のURLに戻ります。

すると、修正内容が目次にも反映されます。(「01/03」の直下の数字が150⇒350に変わりました!)

いつも最新の状態で、支出額を振り返ることができます。

動的に直近2週間分を表示


さて、日付が進んで、1月17日になったとしましょう。

すると、前述の目次は以下の様に変わります。

つまり、当日(01/17)を含む週と、その前の週が表示される様に、動的に変化するのです!

こうすることで、常に直近2週間を振り返ることができます。また、記帳を忘れてしまっても、目次から過去の日付を選んで追加記入できます。

入力ボックスから任意の日付を呼び出せる

目次にない、もっと前の日付については、日別帳票の「日付設定」で日付を指定することで呼び出せます。


GASで作成できる「どこでも家計簿」の動的2週間目次付きバージョン、いかがでしょうか。

このアプリを使って、毎日の支出をスマートフォンなどから記帳することで、家計簿を付けるとともに、直近の支出の振り返りも出来るという訳です。

プログラムの詳細については、次回以降にご説明します。

この記事が気に入ったらサポートをしてみませんか?