最初に
どうしても、技術者は技術で物事を解決しようとする。
それはとても良いことですが、
「たまには怠惰に別の方法での解決を模索してみよう。」
ということで、特に目新しい技術を使わずにWEB SERVICEをリリースしてみたので記事にしたいと思います。
結論
会議時間の見える化サービス「MetWatch」をリリースしました。
コンセプト
全体
自分も会社に務めていて、1日の大半を会議で埋まると「今日は何もしていないな」などと感じてしまいます。
そこで、この時間がどれくらい「無駄か」を見えるようにすれば会社として会議のあり方をもう少し考えてくれるのではないかと思って作成しようと思いました。
さらに…そのようなニーズを持った人をそのサイトに呼び込むことが可能かも含めて試してみたいと思ったところもあります。
目的
・「会議が無駄」と感じているユーザが使いやすいものを作る
・共有しやすいものを作りたい
・そういったユーザが当サイトにうまく集められるか試したい
機能
会議が行っているとコストがかかることを体感させたいので、下記のような仕様にしました。
・リアルタイムでコストを計算し表示
・ユーザの年収は個別で設定可能
・部屋などの費用も入力可能
・共有しやすいようにURL引数で人数や部屋代などの初期値を指定可能
（後で記載するようにQRコードなどでの共有を想定）
・それなりに見栄えを良くする
開発
利用技術
開発については細かい話は端折りますが、下記のような技術を利用して構築しました。
クライアントサイド
・html
・css
・vue.js
・bootstrap
サーバサイド
・docker
・docker-compose
・node
SaaS/IaaS等
・Google Cloud Platform
・freenom
開発手順
開発の手順としては下記のような形で行いました。
①自PCで仕組みだけ構築
仕組みだけなので、デザインは気にせずにVue.jsを勉強しながらリアルタイムでコストが表示される部分だけを作成しました。
また、URL引数を受け取り値を初期化する部分の仕組みについても構築しました。
この時点でテスト仕様書（項目だけのものですが…）を作成し、簡便なテストを行って完成としました。
②自PCで外見を飾り付け
ここも力を入れたくなかったのでbootstrapを持ってきて、それっぽく組み合わせる事を主として行っています。
ここまでメインのページが完成しました。
③ドキュメント作成
今回の目玉であるQRコードの作成と、それを挿入したドキュメントを作成しました。
また、それを表示するための別ページを構築しました。
④サーバ側リソース確保
今回はGoogleCloudPlatformの無料枠でサーバを立ち上げました。
また、ドメインについてもfreenomにて無料で取得したものです。
証明書についてはdocker-composeのhttps-portalというものを利用してLet's Encryptで取得したものを利用しています。
⑤公開・告知
私のTwitterアカウントで告知を行いました
会議にかかるコストを計算するアプリをリリースしてみた。https://t.co/k1m0l4XA0s
— はしと (@hasitozzz) September 4, 2019
反響
なんと1週間で9名の方にお越しいただけました！(内1名は私)
おしまい。