エンジニアのためのポモドーロタイマー

つくったもの

Sandglass
GitHubと連携する事で、作業履歴を確認する事ができるエンジニア向けポモドーロタイマーです。

作業の集中が切れたり、かけた時間に対してコードが書けていない事があり、作業効率を上げたいと思った所で先輩から教えていただいたのがポモドーロ・タイマーでした。

ポモドーロ・タイマー形式のWebアプリはありますが、単純なタイマー機能のみの物が多かったので幾つか機能を追加して作成してみました。 f:id:takorras:20180303015734p:plain

そもそもポモドーロとは

ポモドーロ・テクニックという集中力管理手法で、25分作業して5分休憩…といった短い区切りの作業と休憩を繰り返します。 作業と休憩を5回繰り返したら、25分の大きい休憩をとる事ができます。

つけた機能

  • タイマー機能
    25分の作業と5分の休憩を計測をする、基本的な機能です。設定からYouTubeの動画・音声をアラームとしてセットする事もできます。

  • コミット数確認
    今行っている作業で、どれだけコミットしたか表示します。

  • 作業履歴確認
    一週間の間で、どれだけ作業してどれだけコミットしたか確認できます。どんな内容のコミットをしたか確認できるようにしたいです。

  • Qiitaの記事を見る
    休憩中にチラッと読めるQiitaの記事を垂れ流します。作業中は隠れます。

使ってよかったこと、よくなかったこと

  • 効率があがる
    2時間ぶっ通して作業をするなら、ポモドーロを活用して作業した方が集中力が持続し、書ける分量も多かったです。

  • 自分の時間の捌き方を認識できる
    かけた時間と作業を振り返ると、どんな箇所に時間をかけていて、どんなとこが手早くできているか確認できます。

  • 疲れる
    25分間は実際短く感じました。時間に追われながら作業している感覚もあり、捗りますが慣れるまでは疲れました。

技術

DBとサーバにはFirebase、フロントはReact + Reduxを使っています。

Firebase Realtime DBはリアルタイムにデータが同期され、設定も簡単ですごく便利でした。ただ構造がRDBとは異なりツリー状になるので、要素にアクセスするとその子要素を全て取得します。多くのデータや複雑なデータを保持したい場合は注意しないとパフォーマンスが悪くなりそうです。無料なのにfirebaseはすごい。

React + Redux はCreate React Appで土台をつくり、Reduxなど追加しました。Create React Appはwebpackやbabelが分からなかった私でも簡単に作成でき、触りやすかったです。React, Reduxに関する記事や知見は多くて、初学者でも学びやすいと感じました。

感想

これから開発する際に使おうと思って作成したので、自分で使って欲しい機能はガンガン追加します。あとイケてない書き方のコードもたくさんあるので、修正します…

github.com