Nuxt + Firebase + Elasticsearch 勉強用Qiita まとめ


NuxtでFirestoreとElasticsearchを使いたかったのでその際に勉強になったサイトをまとめておきます。

シンプルにFirestoreを導入したい場合

storeで使えるのはindex.jsのみ
Nuxt.js + Firebase Authentication + FireStoreでwebアプリケーションハンズオン

VuexFileでFirestoreを導入したい場合

storeのファイル名をindex.js以外の名前にする場合VuexFileが必要になります。
storeを分けて使いたい場合はこちらがおすすめ

VuexFireでNuxt.jsアプリに一瞬でFirestoreを導入する

2019/10時点でVuexFileの仕様が変わってるため下記のサイトを参考に

Nuxt×vuexfireでちょっとハマった

VuexFireを使おうと過去のサンプルをコピペしたらはまった話

index.jsにmutationを書くところ、firebaseではなくfirestoreと書くところあたりです。

*FirebaseとElasticserchを使いたい場合

天網恢恢疎にして漏らさず全文検索 ~firestore + Elasticsearch + react native~

onSnapshot()の機能

Elasticserch

Elasticsearchの基本

これらのサイトを見れば基本的な使い方、機能は理解できます。
初心者のためのElasticsearchその1
初心者のためのElasticsearchその2
初心者のためのElasticsearchその3 -node.jsからアクセスする-

*Homebrewでのインストール
Elasticsearchのインストール

/// 起動コマンド
$ cd /usr/local/var/homebrew/linked/elasticsearch-full
$ bin/elasticsearch

kibanaのインストール

/// 起動コマンド
$ cd /usr/local/var/homebrew/linked/kibana-full
$ bin/kibana

日本語検索用kuromojiのインストール

Elasticserch 意味 RDBMSで例えると
Index データの保管場所 Database
type table
field  データ型  カラム
document データの本体 レコード

インデックスの作り方

$ curl -X PUT http://localhost:9200/firebase_user?pretty

query

こちらの記事が参考になります

Querying ElasticSearch - A Tutorial and Guide