この記事は、PORT Advent Calendar 2018の24日目です。
クリスマスイブの日の担当は、新卒2年目の小川がお送りします。
業務は事業企画を主に行っており、必要な時は開発も行っています。
#はじめに
タイトルにも書きましたが、物理的に近い人とチャットできるサービスを作りました!
下記にそのサービスを作ろうと思った経緯と使用した技術について書いていきます。
サービス立案の経緯
この世は便利になったもので、どんなに遠く離れていてもメッセージのやりとりやビデオ通話なんてすぐできます。
とはいえ、普通に過ごしてたら永遠に交流できない人もたくさんいます。エンジニアなんかは、基本的に悲しい生き物なので、なおのこと生活ルーティン外の人とは交流できません。
そんな中でも現在知らない人と交流できるサービスはたくさんあります。
- SNS
- マッチングアプリ
- ランダムな人とチャットできるサービス
- etc...
色々ありますが、SNSはコミュニティを作るまで時間がかかるし、マッチングアプリは気軽に登録できない。
ランダムチャット系はユーザーの共通点・目的がなかなか一致しないのもあるのか、盛り上がっている印象はありません。
共通点・目的が一致していて絶対交流できなかっただろう人とを、気軽に引き合わせられるサービス作ってみたいと考え、物理的に近い人とチャットできるサービスを作成しました！
共通点を自分らがいる場所（例えば新宿駅前）とし、目的をチャットルーム（例えば新宿付近の電源あるカフェ教えて）で分け、よりスモールな2ch的な感じで盛り上がることってあるかな？と思いました。会員登録も特にさせず、めっちゃ気軽さも重視させます。
あとは後述してますが、firebase × vue × SPAで何か作ってみたかったというのがでかいです。
使用技術
サーバサイド
チャットが主になるので、速攻で開発ができるfirebaseを使いました。
firestorageとhostingを使っています。
フロントエンド
フレームワークはvueを選択しました。
遷移スピードも早めにしたいし、挙動を少しでもネイティブに近づけたいので、SPAを採用しました。
出来上がったもの
上記のチャットサービスが出来上がりました。全体的な機能は、
・ユーザーはニックネームの入力のみで参加可能。
・誰でもチャットルームを作成可能。
・チャットルームが作られた地点から半径500m以内の人がチャットルームに入れる。
・チャットルームは作られてから24時間だけ有効。
以上のような感じになりました。
位置情報を使うサービスなので、位置情報取得を許可しないと使えません。
ニックネームを入力すると、
のように、今いる場所周辺のチャットルーム一覧が出てきて、
チャットルームに入ると、チャットに参加できます。
作ってみての反省
ディテールコミット
いくら必要最低限の機能しかなく急ぎで作ったとはいえ、他のチャットツールと比べて細かいUXがよくない。
投稿フォームの改行時はフォームを縦に広げてあげる。そもそもメッセージ投稿のフォームがスマホの時バグる。まだ画面に現れてないメッセージに印つける（ここまで読んだ的な）。上への無限スクロール。その他諸々。
今のいろんなアプリをみていると、顕在的には気づかないところまでストレスなく作られていることに気づく。
NoSQLのデータベース設計
RDB脳。今はコレクション数が少ないのでなんとかなっているが、多くなってきたら不整合起きそう。
いろんな記事とか読んだが、やっぱりまだ正規化しようとしちゃう。単純なクエリだけじゃなく、2~4のコレクションを使うようなクエリを実際に投げて、取得しやすいしずらいを開発の中で体感していくことが大切と実感。
最後に
もっとしっかりサービスとして打ち出していくには色々な懸念点とかを洗い出さなければ行けなそうですが、firebase使うと速攻でチャットサービスって作れちゃうんですね。
今回でなんとなく知っているSPAも、実装の経験できて楽しかったです。
最初にサービス立案の経緯とか大げさなこと言ってますが、ほんとの経緯はクリスマスとかで待ち合わせしている人の可処分時間奪うにはどうしたらいいかという、くだらない起点からのただのジャストアイデアです。