社内ハッカソンでタイマーを作ってみました！

初めまして、mcho71と申します！昨年の10月にco-meetingに入社しました。

社内ハッカソンでタイマーを作ったので、そのことについて書いてみます。

作ったものについて

今回作ったものはタイマーです。

スタート/ストップ、リセットに加えて、複数のタイマーを順に実行することができます。

タイマーの設定はURLで保持されていて、簡単に共有することができます。

Example - Timer

どうして作ったのか

作り始めた当初は、複数のブラウザで同期的に動いたり、バックグラウンドで動くタイマーが欲しいという気持ちでした。

どんなふうに進めたか

まず、欲しい機能を書き出しました。

・通常のタイマー機能
・キュー
・ループ再生
・バックグラウンド実行
・複数ブラウザでのリアルタイム共有

次に、これらが実装できるかの調査をしました。その結果、バックグラウンド実行と複数ブラウザでのリアルタイム共有はサーバーを持つ必要があり、後回しにすることにしました。結果的に実装できていません😭

技術的に使用するものは、フロントエンドのフレームワークであるAngularと、ホスティングのためのGitHubPagesに決めました。
採用理由は、Angularは、以前はよく触っていたんですが最近は触る機会がなく、久しぶりに触りたかったからで、GitHubPagesは一番手軽だったからです。

また、プロジェクトの構成はangular/aio at master · angular/angularを参考にしてみました。scopedなコンポーネントへのscssによるスタイルの当て方など、とても参考になりました。

後書き

このような自由な開発を行える時間はとても楽しかったです。それとともに、開発の気分の乗せ方や、締め切りギリギリに焦らないためにどうするべきかなど、自分の作業の進め方を見つめ直す良い機会になりました。

repository: mcho71/timer