目次
はじめに
こどもの面白い名言を記録できるサービス「Cotomemory（コトメモリー）」をリリースしました。
今回の記事ではサービスの説明や苦労したことなどについて書きたいと思います。
自己紹介
フィヨルドブートキャンプでプログラミングの学習しているsiroです。 普段は自社サービスのカスタマーサポートなどのお仕事をしています。
プライベートでは3姉妹の母として日々子育てに奮闘中です。 今回、子育てに関するWEBアプリを作成しました。
Cotomemoryについて
今回リリースしたCotomemory（コトメモリー）はこどもの面白い名言を記録できるサービスです。
子育てをしていると、こどもの可愛い発言に癒されたり、ふとした言葉で成長を感じることはありませんか？
子育て中の方なら、きっと可愛い名言に出くわしたことがあると思います。
Cotomemoryはそんな可愛い名言を忘れてしまわぬように 名言と発言した時のこどもの年齢を記録できるサービスです。
Cotomemoryの使い方
Cotomemoryの使い方を簡単に紹介します。
【名言の登録について】
まずはGoogleでログインします。ログインしたらこどもの情報を登録する画面が表示されるので、こどもの名前と誕生日を入力してください。
こどもの情報を登録すると名言一覧が表示され、名言を登録できるようになります。
【招待機能について】
家族を招待する機能も用意しており、家族を招待すると同じ名言見ることができるようになります。
招待する人は「家族を招待する」のページから招待URLを取得し、家族に伝えてください。招待された人は招待URLからログインすると家族と紐づきます。
名言にはコメントを残すことができるので、家族を招待するときっと盛り上がるはずです！是非一度使ってみてください！
Cotomemoryをつくったきっかけ
このサービスのきっかけになったのは、同じフィヨルドブートキャンプ受講生のかわかみさんです。かわかみさんも子育て中のママさんです。
以前、かわかみさんから「こどもの名言を忘れないようにスプレッドシートにメモしている」という話を聞いたことがありました。
かわかみさんは 家族と一緒に名言を読み返して盛り上がっていたり、お子さんも名言の記録を楽しんでいたりと、こどもの名言が家族のコミュニケーションにつながっていて素敵だなと思ったことを覚えています。
かわかみさんの話を聞いて、「こどもの名言記録のサービスを作ればスプレッドシートよりも簡単に記録できるのでは？」と思ったのがきっかけです。
私もこども達の面白い発言を聞く機会は多いのですが、時が経つにつれて忘れてしまうことが多く、大事な思い出が薄れていくことに寂しさを感じていたので、こどもの名言を記録できるサービスを作ることにしました！
ユーザーへのヒアリング
サービスをつくる前に 名言をスプレッドシートで記録していたかわかみさんに記録状況などをヒアリングしました。
名言は突然生まれて、生まれた側から忘れられていく
お話を聞くなかで
- スプレッドシートに名言を記録しているが、シートを開くのに時間がかかる
- 名言を書く時間がない時は名言自体を忘れてしまうことがある
という課題があることがわかりました。
この課題を解決するために
- 名言が生まれた瞬間に簡単に記録できる
- スマホユーザーが使うことを前提にする
という方針を決めてサービスをつくることにしました。
（かわかみさんとお話しする中で「名言は突然生まれて、生まれた側から忘れられていく」という名言をいただきました✨）
ユーザーの目線でつくる
ヒアリングした内容からユーザーの目線に立って実装していきました。
一例で言うと、名言の入力フォームです。 最初の案では名言を記録するだけでなく、「名言を発言した状況」など、複数の項目を細かく記録できるようにするつもりでした。
ただ、ユーザーヒアリングの内容から「名言が生まれた瞬間に簡単にメモしたい」という方針があったので、複数の登録項目を用意するのではなく、名言の内容だけを登録できるシンプルな入力フォームにしました。
実際に使ってみると、名言をサクッとメモできるので項目を減らして良かったなと思っています。
苦労したところ
技術選定の難しさ
自作サービスを作るにあたり、技術選定で右往左往しました。
今回のサービスでは最終的にRails7とHotwireで実装したのですが、序盤では
- 自分の技術力をつけたい
- 技術的要素を組み込みたい
という理由からまだ触ったことのないNext.jsを使って実装しようとしていました。
バックエンドはRails、フロントエンドはNext.jsという構成で作り始めていたのですが、リソース設計をメンターの方に見てもらっている中で自分の技術不足で考慮していなかった点が見つかったり、一つの機能を作るにもかなり時間がかかっている状況でした。
- このままではリリースまでの期間が延びてしまう
- Cotomemoryの機能はRailsだけでも作ることができる
- Next.jsで実装するのに比べHotwireでの実装は学習コストが低そう
- Railsでリリースした後に少しずつ新しい技術を取り入れるのも良さそう
という理由から、最終的にRailsとHotwireの組み合わせで進めることにしました。 技術選定で右往左往したのですが、結果的にはRailsの技術を深めることができたので良かったと感じています。
また、Hotwireに関してはSPAのような動きをJavaScriptをあまり書かずに作成できて驚きでした。名言を登録するとリロードせずとも名言一覧に表示させたり、名言一覧の無限スクロール機能などもHotwireで実装しました。
Hotwireについては「猫でもわかるHotwire入門」がとても参考になりました。
また、フィヨルドブートキャンプのカリキュラムではminitestを勉強していたのですが、実際の現場ではRSpecを使うことが多いと聞いていたので、RSpecでテストを書きました。
最終的には以下の技術スタックで作成しております。
- Ruby 3.2.2
- Ruby on Rails 7.0.5
- Hotwire
- PostgreSQL
- TailwindCSS
- RSpec
- Github Actions
- Fly.io
- Amazon S3
自作サービスはやること盛り沢山
1つのサービスをリリースするまでにはたくさんのタスクがありました。（CotomemoryのリリースまでのIssueは150件ほど）
- どの技術を使うか選定する
- DB設計、リソース設計
- 機能の実装
- テストを書く
- サービス名を決める
- ロゴをつくる ...
自作サービスは考えていた以上の作業量があり、先のことを考えると「本当に完成するのか」と不安になることがありました。
仕事や子育てが忙しくなると進捗も出せなくなっていたので、できる限り一つのIssueを細かく設定し、少しずつでも前に進めるようにしました。 大きなIssueは30分くらいで終わるレベルのIssueに分けると取り掛かりのハードルも下がり、結果的に進捗が出ていることが多かったです。
小さいことをどんどん積み上げて完成まで辿り着きました。
リリースまで終えた感想
自信がついた
リリースまでを終えて一番感じていることは自信がついたなということです。
サービスを作り終えるまでに何度も分からないことに遭遇したり、次から次にバグが出てきたりと心が折れそうになることもありましたが、「絶対にリリースするぞ」という気持ちでどうにか自分で解決したり、メンターの方に相談しながらサービスをつくりあげました。
自作サービスを通して「どんなことでも継続すればやり遂げられる」という自信がついたのが大きいです。
英語を読むのが苦ではなくなった
フィヨルドブートキャンプに入ったばかりの頃は「英語のドキュメントを読むのは大変だな」と思っていたのですが、自作サービスを作っていくうちに「欲しい情報が英語でしか書いていない」「公式ドキュメントが英語のみ」という場面によく遭遇しました。
英語のドキュメントも読まざるを得ない状況になって、読んでいくうちに苦手意識も薄れてきた気がします。
子育てとの両立は大変だ
昨年の秋頃からCotomemoryを作り始めていたのですが、今年の1月に第三子を出産したことで、その前後はほとんど作業ができずリリースまでかなり時間がかかってしまいました。
「子育てと勉強を両立もできる！」と自信満々に言いたかったんですが、特に裏技的なものはありませんでした。
一つ、気をつけたことといえば無理しすぎないことです。
以前、メンターの方から「フィヨルドブートキャンプは長距離マラソンのようなものだから息切れしないように、自分のペースで無理なく続けると良い」というコメントをいただいたことがありました。
私の中でこの言葉にすごく腑に落ちていて「周りの人と比べるとスローだけど少しずつ前に進むぞ」という気持ちで走り切りました。子育ての期間にもこれだけ頑張れたのは今後の糧になると思います。
さいごに
2020年11月にフィヨルドブートキャンプに入会して時間はかかりましたが、自分のサービスを作ることができるようになりました。
komagataさん、machidaさん、メンターの方々、協力してくれたかわかみさん、いつも雑談してくれた受講生の皆さん、日報にコメントくださった皆さん、たくさんお世話になりました！
これからも、もっと技術力をつけて活躍できるように頑張ります。
