日々の振り返りを便利にするwebサービスを作りました
概要
なお、振り返りの項目と内容については、yuzutas0さんの記事を参考にしています。
どんなサービスか
- YWTによる振り返りをテーマごとに時系列で一覧表示してくれるサービスです
- YWTとは
- Y(やったこと)
- W(分かったこと)
- T(次にやること)
- 振り返りのフレームワークとしてはKPTが有名ですが、YWTは試行錯誤して行う経験学習に関して、より振り返りがしやすいとのこと
どうやって使うのか
まずはじめに、振り返るテーマを作成します
テーマが一覧で表示されます。各テーマに対して、YWTを登録していきます
登録したYWTを一覧で見ることができます
なぜ作ったのか
- 日々の振り返りを管理する方法にしっくりくるものが無かった
- メモ帳ではテーマごとにまとめづらい
- evernoteのようにテーマごとにページを分けると、管理が煩雑になる
- 個人の振り返りとしてはYWTの方がしっくり来る
- 入力がしやすく、一覧で確認しやすいツールが欲しかった
どうやって作ったのか
システム構成
- IaaS：Google Cloud Platform(GCE/f1-micro)
- OS：CentOS 7
- WEBサーバ：Nginx
- APサーバ：Unicorn
- DB：MySQL
- フロントエンド： Sass、BEM
- バックエンド：Ruby on Rails
企画
- 最初は3ヶ月単位で目標を設定して、それに対して振り返りを書き込む形式でしたが、仕様を整理していく中で、「PDCAを回したいこと」と、それに対しての日々の振り返りが一覧になっていた方がわかりやすいことに気づきました
- 目標に対して、継続して改善ができていない感じ、振り返りがうまくできていない感じを解決したい、というのが開発の発端です
ペルソナ
どんな利用者を想定しているか。
こちらは基本的に自分が利用する想定なので、ざっくりと設定しました
- 中小企業に勤める30才前後のマネージャー候補
- 仕事量も増え、これまでの作業型の仕事から目標設定が仕事が増えてきた
- 業務内容が高度化し、これからどのように改善していけばいいか悩んでいる
課題
どんな痛みを抱えているのか。
解決策
なぜ既存の製品では駄目なのか。
- 従来のプロジェクトマネジメントツールはタスクベースで、目標とそれに向かうアプローチを管理しづらい
- 目標管理ツールはエクセルなどで提供されていることが多いが、スマーフォンでは入力しづらい
- webでデイリーの入力を楽にして、整理した状態で振り返りたい
開発
要件定義
業務要件
- 目標設定→デイリーでのYWT記入→振り返り
機能要件
- ユーザ認証
- テーマ入力
- 例）運動の習慣をつけたい
- YWT入力
- やったこと
- わかったこと
- 次にやること
- 一覧表示（テーマごと）
- テーマのCRUD処理
- YWTのCRUD処理
- ユーザーのCRUD処理
- Action MailerでGmailを使って自動メール送信
非機能要件
- セキュリティについては、最低限実装時に注意するべきポイントは押さえる(SQLインジェクション、XSS，CSRF)
- その他は保守しながら随時検討
設計
- 画面遷移を紙に書いて、それをベースに必要な処理やDB構造を考えました
- 普段はフロントエンドエンジニアなので、画面がないと作るものがイメージしづらいのですが、サーバサイドメインの方がどう作ってるのか気になります
フロントエンド
- 今回はRailsのViewをそのまま使用
- フロントはRailsの仕組みと密結合している部分が多く、開発が辛かったです
- Railsを覚えるだけで１人でフルスタックに開発できる強みがある一方で、フロントエンドエンジニアがいるなら、RailsのViewはヘルパータグを使わず、変数だけにするか、いっそSPAにしてもいいかなと思いました
- CSSはSprocketsを使ってSCSSをビルドしました
- Vue.js等のフレームワークは使用していないので、CSS設計を行いました
- 記法はBEMベースで、SMACSSのルールを混ぜた独自設計にしました。覚えることが少なく、ちょっとした開発に使いやすい感じになったので、個人的に気に入っています
- アイコンはGoogleのmaterial iconsを使いました
- FontAwesomeは他のテキストと並べた際に縦位置の調整が面倒になる事が多く、デザインも個人的に相性が良くないので、あまり使っていません
デプロイ
- CircleCI 2.0を使いました
- GitHubのプライベートリポジトリからmasterへのpushをトリガーhookにして、CircleCIのコンテナ内から本番環境にsshで接続してデプロイするようになっています
リリース
- Google Computed Engine(GCE)を使用しました
- 開発環境はdocker-composeを使って構築しましたが、本番環境はそのままCentOSにnginx等を手動でインストールして構築しました
- メモリが600MBほどしかなく、そのままだとbundle installができないため、swap領域を追加
- Let's EncryptでSSL証明書を発行し、インストール
GCPで静的IPを取得、Cloud DNSでDNSを設定→ アーカイブ化のため、Herokuに移動しました
感想
- Railsより、サーバの構築で詰まることが多かったです
- How Toにかかれていないような部分で詰まることが多く、同時にそれらを自力で解決したことが、とても良い経験になりました
- 個人で開発するための環境構築や作業フローもまだまだ小慣れていないため、今後どんどん効率化していきたいです
