RAKUS Developers Blog | ラクス エンジニアブログ

株式会社ラクスのITエンジニアによる技術ブログです。

「Nuxt.js + firebaseでハマったこと」というタイトルで初LTデビューしました

f:id:syoneshin:20200828161207j:plain先日行われました、フロントエンドLT会 vol.1 -2020夏祭り- にて初LTを無事終えました。logy0704です。

rakus.connpass.com

今回はLT会で発表した内容に加えて、スライドには収めきれなかった話について書きたいと思います。

speakerdeck.com

Nuxt.jsとfirebaseに興味を持ったきっかけ

vue.jsとfirebaseの組み合わせについては、過去のエンジニアブログでも何度か触れられていたこともあり、いつか触りたいという思いがありました。

tech-blog.rakus.co.jp

tech-blog.rakus.co.jp

加えて、環境構築周りの負荷軽減(vuex, vue-router)、将来的にPWAにも触れてみたいというモチベーションでNuxt.jsとfirebaseの組み合わせに至りました。

他にNuxt.jsを採用する理由としては、SSR(サーバーサイドレンダリング)が思い浮かびますが、今回の学習ではSPAモードを利用し、SSRは採用しませんでした。 理由は、スライドにもある通り、バックエンド周りのことを極力気にしたくなかったからです。

他にハマったこと RealtimeDatabase vs FireStore

これはハマったことというよりも知見がなかったため、考察に時間がかかったというほうが正しいです。

どちらもFirebaseによって提供されるクラウドホスト型 NoSQL データベースですが、似て非なる特徴を持っています。 具体的な選定ポイントについては、こちらのページを参考にさせていただきました。

firebase.google.com

ページの記載からは、ややFireStore推しであるようにも受け取れますが、それぞれの特徴を踏まえた選択を行う必要があります。

特に、データモデルが異なるため、一度片方を利用し始めた後に、もう一方に乗り換えるのはなかなか難しいため注意が必要です。

今回のアプリでは、Realtime databaseを選択しました。 理由は、簡易なTODOアプリとしての利用であれば、FireStoreのような複雑なクエリは必要ないと判断したからです。

実際の商用レベルのアプリであれば、将来の機能拡張を加味した検討が必要になると思います。

おわりに

100人以上が聞いてくれている中での発表でLTデビューというのは多少緊張しましたが、良い経験になりました。

他の方の発表が良い刺激になったことは勿論、いざ自分が発表するとなると、あれこれ準備したりする分、やりっぱなしよりも知識が定着する気がします。 これが登壇駆動開発…!

Copyright © RAKUS Co., Ltd. All rights reserved.