見出し画像

お小遣い帳アプリを作ってみた！

SASAKEN@受験勉強

こんばんは、SASAKENです。
テストは、めちゃくちゃ前にもう終わりました。
最近、忙しくて、Noteの更新ができていなかったのですが、お小遣い帳アプリを作りました。
今回は、それについて紹介します！


私がお小遣い帳アプリケーションを作った経緯

ずっと前から、親に「何かのアプリで、お小遣い帳をつけなさい。」と言われていたのですが、自分に気に入って、親からもらってる条件にもあうようなアプリがなかったのです。

それから1年経過
ようやく、お小遣い帳をつけるときに、最善の方法を思いついたのです。
プログラマーなら「作っちゃえばいいじゃん。」
こうして、2時間で終わると思い、作り始めたのである。（この後の苦労を全く知らずに）

作り始めた

作り始めて、「お小遣い帳アプリに必要な機能は、何か。」と考え始めました。
私が必要と思う機能と、私の親が必要と思う機能

私が必要と思った機能（プログラマー目線）

  • ログイン機能

  • サインアップ機能

  • データベースにアクセスする機能

  • データベースで、ユーザーごとに、現在の残額と、ユーザーが記録したデータを記録する機能

私の親が必要だとおもた機能（ユーザー目線）

  • テーブルを書く機能

  • テーブルのデータ　その時使った後の残額、支出、収入、何で使ったか

このような感じになりました。
それで、私は、このように考えます。

残額　Numberデータ型
支出　Numberデータ型
収入　Numberデータ型
カテゴリー Stringデータ型
時間での管理で、FireBaseで作るか。

こうして開発がスタートしたのだ。

開発中(1週間目)

最初は、ChatGPTや、Google BardなどのAIを駆使して、2時間で終わるだろうと思っていた。
そんなことは、なかった。
意外と、GPT3は、言うことを聞いてコーディングしてくれなかった。
（これは、私が言った内容が不適切だった可能性がめちゃくちゃあります。）(ちゃんと、OSづくりなどでは、お世話になっており、感謝しております。)
GPT4なら結果は、違ったと思います。
コツコツ自分で作っていった。

バグ(2週間目)

重複バグ、残高が、1000 + 2000で、 「10002000」このようになることが発覚など、色々ありました。
Numberコンストラクタを使用して、設計する必要があったみたいです。

↑詳細は、こちら(MDN)
これだけでなく重複バグは、すごく苦労しました。

バグ修正前 forでループして、それをどんどん書き込めばいいだろう 「2回目更新ボタンをクリック」　どんどん増える そりゃぁそうだ　すぐに修正 それでも重複する。　イベントのログを出してみても、１回しかForは、ループしていない。 

var isDuplicate;

のように定義。
そうすることによって、なくなるだろうと考えた

if (!isDuplicate) {
     //データベース読み込みの処理
} else {
　　　//何もせずにデータは関数から立ち去る
     return;
}

バグの結果


このような行を追加するだけで良いとわかった

開発日記

1日目　サインイン機能を実装
2日目　サインアップ機能を実装
3日目　テーブルの機能を追加
4日目　ほぼ出来上がり
5日目　親への紹介で、バグが多発（はづかしすぎて草。）
6日目　そのバグの一つを修正
7日目　そのバグのもう一つを修正中
8日目　そのバグの少しを修正
9日目　完全に修正
10日目　重複バグを修正
11日目　PWAに対応して終わり

長かったけど、FireStore周りの勉強になって良かったと思います。
（これから長らくフロントエンドの開発は、行わないけど）

終わり

終わりに、宣伝。

https://t.co/To57ZHONgt

最近少しわたしたちが作っているLinuxディストロが人気になってきているようです。
β2は、この秋リリース予定です。　（間に合うかな？）
少なくとも、私の期末テストが終わらないとできないと思う。
冬になるかも。
終わり。


いいなと思ったら応援しよう！