ソース：https://github.com/opengl-8080/counter

• Count Up をクリックすると、カウントが１加算される。
• Reset をクリックすると、カウントが０になる。
• 最後にカウントアップしてから 27 時間カウントアップされないと、自動的にカウントが０になる。
  • 24 時間を制限にすると、徐々にクリックしないといけない時間が前にズレていくので、若干余裕を持たせて 27 時間にしている。
• カウントが上がるに連れて、徐々に文字が大きくなる。
• データはローカルストレージに保存する。
  • カウントと最終更新日時。
• 残り時間の表示は随時更新されており、１時間を切ると文字が赤くなる。

三日坊主を防止したい「作業」をしたら、毎日必ず Count Up をクリックする。
忘れたり、やらなかったらカウントアップしない→０に戻る。

日々増えていくカウントに、モチベーションが維持される。
せっかく溜まったカウントがゼロに戻る絶望感を味わわないようにするためには、毎日欠かさず「作業」をしてカウントアップしないといけない。

「作業」が具体的に何なのかは、使う人次第。

そんな感じ。

参考

• HTML - GitHubでWebページを公開する方法 - Qiita
• HTML5のlocalStorageの使い方のまとめ: 小粋空間