【バグと執念】AIで知識ゼロからアプリ開発1000時間｜#7：消えるバグ、消えない想い

ざっくり要約

直したはずのバグがなぜかまた出てくる。状態が保存されねくてイライラ。ReactのuseStateは便利だけど、保存せねば次の日は忘れられる。ローカルストレージに保存すれば一安心。ペルソナ5風の見た目にもこだわりながら、試行錯誤しながら少しずつ理想に近づいていく話だじゃ。

昨日、「虚偽の報告回数」が1回になったの、はっきり覚えでらったんず。アラートも出たし、値も変わった。でも次の日、アプリ開いてみだら…0回に戻ってらんず。へばなんだべ？と、思ったの。

「まさか、バグってやつに記憶力ねぇのか？」

実はそう、ReactのuseStateっつうのは、記憶力のねぇやつなんず。状態はリロードするたびに初期化されるもんで、せっかくsetFalseReportCountで回数増やしても、保存しねば次の日にはパーだじゃ。

◆ 状態ってなんだべ？

状態（State）ってのは、Reactで「今どういう状態か」ってのを持つ仕組みなんず。でもこれは“保存”ではねぇ。アプリが閉じたりリロードされだら、全部忘れられでしまう。
だから「保存」するには、localStorageってやつに書き込まねばならねんず。

useEffect(() => {
  localStorage.setItem("falseReportCount", JSON.stringify(falseReportCount));
}, [falseReportCount]);

こんた風に書いで、falseReportCountが変わるたびに保存するようにしてやるんず。そして読み込む時は…

useEffect(() => {
  const saved = localStorage.getItem("falseReportCount");
  if (saved) {
    setFalseReportCount(JSON.parse(saved));
  }
}, []);

これでやっと「昨日の記憶」が戻ってくるってわけだじゃ。

◆ AppとTaskManager、どっちで持つのがええのか問題

最初はTaskManager.jsでfalseReportCount管理してだんず。でもSettings.jsに値を渡したいってなって、App.jsに移したんずな。
だけど移したら今度は、TaskManagerでsetFalseReportCountをpropsから受け取るの忘れでエラー祭りさ。
「props.setFalseReportCount is not a function」とか言われで、も〜腹立つ！

◆ ペルソナ5風への執念

見た目も手ぇ抜ぎだぐない。フォントを変えで、赤と白のシャドウを重ねて、日付に派手な装飾つけで、まるでゲームのUIのようにしたんず。
でも、文字サイズが変わらね！font-size効かね！ってなったら、ただのクラス付け忘れだったりして、ほんとこういう小さなミスが一番時間食うんず。

◆ まとめ：直したバグが戻るとき、人は成長する

バグを直したと思ったら戻ってくる。保存したと思ったら保存されてない。コードは生き物みてぇで、一つ一つ相手さしてるみてだ。
でも、その度に少しずつ「自分の作った世界」が現実に近づいでいくんず。

一歩ずつでも、やれば変わる。情熱さえ消さねば、昨日より今日、アプリも自分も、ちょっと良くなってら。

本日の一句

けぇってみだら　またゼロさ戻ってら　おらのバグ