ユーザーの方から、「何日の問題がちょっとおかしかったです」的なご指摘を何度か頂いた。日替わり通信術の電報文は、毎日上書きしていて過去のデータは残していないためにバグの確認もできない。
一応バックアップを残すようにするか、と考え始めたところ、どうせならサーバ上にバックアップをとって、それを参照すれば過去の日替わり問題を練習できるのでは、と思い立って実装を開始。
バックアップはシェルスクリプトで比較的簡単にできたけれど、過去問題の参照はそこそこ苦戦。元々そういう構造にしておらず、日々の問題を同じ場所に上書きして、index.htmlで静的に読み込んでいた。過去問は日々「年/月/日」のフォルダを作って保存されるため、これを動的に読み込む必要がある。
参考になりそうなサイトをググって試してみるものの、こちらの方法はいずれもうまくいかなかった。読み込むタイミングとかの問題だと思うんだけどよくわからず。こちらの方法はうまく動いた。どうやらappendChildメソッドで、headの要素として追加するか、bodyの要素として追加するかで挙動が違うような感じ。
【参考サイト】
これでとりあえず動くようにはなったと思う。ただ、練習問題がたくさんある状態というのが、実力アップに効果があるかどうかは正直わからない。一期一会の日替わり問題だからこそ、毎日真剣勝負で練習できるという面はあると思うし、そのつもりで日替わり形式にした経緯がある。一方で追い込みの時期には毎日2回分の問題では物足りない、というコメントも確かにある。選択肢は用意したので、あとはご自身のスタイルに合わせて使っていただければと思う。
【2022.8.1追記】
1日分の過去データがある状態でデバッグしてリリースしたものの、2日分以上のデータがあると、前日以外のデータが選べないバグがあることがわかった。やはりテストデータも作らず拙速にリリースするとこういうことになる。
過去問題のデータを動的に読み込むと言っても、一度ページを読み込み終わってしまうと、書き換えるためにはページを再読み込みする必要がある。そして再読み込みすると日付選択のカレンダーが前日の日付にリセットされてしまい、毎回前日のデータが読み込まれてしまうというわけ。
そこでCookieに選択した日付を覚えさせてからページをリロードするようにしたら、思ったような動作になった。
日付選択のUIは端末によって動作が異なるし、Cookieとリロードに頼るのもあまり美しくはないけれど、まずは動くことが重要ということで。もっとモダンなコードが書けるようになれたら良いな。