さめたコーヒー

kbaba1001のブログ

Nuxt.js + firebaseを習得したときのロードマップ

Nuxt と firebase で個人開発できるくらいにはなったのでどのように勉強したかを残しておきます。 もともとVueは仕事で使っていてNuxtが初めてという状況でした。

step1. Nuxt.js - Vue.js on Steroids

learning.oreilly.com

これをChapter2まで終わらせる。

step2. Build a News Feed with Nuxt 2 and Firestore

learning.oreilly.com

これを最後まで写経。3時間で終わるかと思ったら結構時間かかった。ビデオの人のタイピングも説明も早い。

step3. 個人開発する

Nuxt + firebase で connpass みたいなものを試しに作った。 SSRでやったので細かいところは適宜ぐぐった。 (しかしSPAでも最近はSEOに乗ったり広告はれたりするようなのでSPAで十分だったと反省している。)

firebase ui が便利だった。 firebase についてはドキュメントが日本語だったので理解しやすくてよかった。 ただドキュメント同士の繋がりがわかりづらいのでもうちょっと目次がしっかりしていたら嬉しかった。 サービス名が似ていて混乱することもあった。

雑感

firebase はコンソールのUIが使いやすくドキュメントもわかりやすく人気が出るのも納得だった。 firestore の検索クエリに関しては結構できることが限られていてRDBのようにいかないので設計のいろはをもうちょっと知りたかったがよい資料を見つけられなかった。 みんなKey Value Store の設計はどうやっているんだろうか。。。リレーションを表現しようとしたときだいぶ苦しい。 複合キーで頑張るみたいなことはわかった。あとはElasticsearchになげるとか。なんとかやってる感があった。

言語は静的型付けが流行っているのにDBはスキーマレスが流行っているのはよくわからない流れだなぁと思う。

やらなかったこと

TypeScriptで書きたかったが Nuxt も firebase もほぼ初めてだったのでとりあえずJavaScript で書いた。 ドキュメントに書いてあるコードを逐次TypeScriptに変形しながらやっていける気がしなかったため。 今は多少なれたのでTypeScriptでもかけそう。 ちょうど個人開発したやつをSSRからSPAで作り直したいのでそれはTypeScriptでやってもいいかもしれない。