Today's Progress:
やってみてすごく便利！と思ったのでブログに書こう書こうと思っていた、 Firebase Functions のローカル環境の作り方をブログにまとめました。
最初に設定したときから1か月くらい経ってしまっていたので、色々バージョンアップしたせいかサーバーが起動できなくなっており…。
結局エラーメッセージからは全然予想しなかった設定で解決しました。だいぶ悩みました…。解決してよかった！
Links to work:
Today's Progress:
JavaScriptの読み込み順、実行順でとにかく引っかかっているなと思います。
ドキュメントを上から順に読んでその通りに並べても動かなくて、どこでinitializeしたインスタンスをどこで使って…というのを意識して読み込み順を整理すると動くようになりました。
ログイン後別のページにリダイレクトさせた際、 firebase.auth() の情報はどうやって引き継いだら…？と思ったのですが、普通に別ページにもfirebaseをinitializeするコードを入れて firebase が使えるようにすると、引き継ぐことができました。
どこまで引き継がれるかはここら辺で設定できるのかな？
認証状態の永続性
Google, Twitter, Email+Password でログインフローが動作することを確認。
Links to work:
Today's Progress:
<script> タグに書いていたコードを .js ファイルに分離<script> タグでHTMLファイルに直書きすれば動くのに、.jsファイルに分離すると動かない、という状況によく陥るのですが、おそらく $(document).ready を入れるべきなのに入れてない、という状況が多いのかなと…。
下記の記事の、
</body>タグの直前にscriptを入れる場合、$(docment).readyは必要ない
という部分で理解できました。
JavaScript・jQueryの改修・高速化のためのメモ - Qiita
またしばらく経つと忘れてしまいそう…！
Links to work:
Today's Progress:
変更できました。今日は仕事関係を結構がんばってしまってあまりこちらは進められずという感じですが…。
結構会話の応答が遅い感じするので、Region変えたら速くなるかなとちょっと期待していたのですが、体感で分かるほどは速くならなかったです（笑）
ひとまず新プロジェクトへの移行作業は完了！
Links to work:
Today's Progress:
元々動いていた機能を一通りコピーできました。
対応内容↓
あとは Function の Region も設定しなおさなければ。
Links to work:
Today's Progress:
今使用しているプロジェクトが1年ほどまえに試作していたものをそのまま使っていて、Location(Region)がUSが選択されていたのですが、現在はTokyoが選べるようになっていて、後々使い続けるとしたら今のうちにTokyoに変更しておいた方が良さそうだったので、プロジェクトを新しく立て直すことにしました。
（Locationだけ変更はできなかった）
ここまで対応した内容。まだ途中です。
.firebaserc で指定されているデフォルトプロジェクト名を、新しいプロジェクト名に書き換えてから firebase initLinks to work:
Today's Progress:
Loadボタンを押したタイミングで、ログインしているユーザーのuidを firebase.auth().currentUser; で取得し、それを元にクエリを作成して読み出すことに成功。
document ID を指定すると1件の .get() でdocumentだけが取得されるけど、 collectionに対してクエリを実行すると .get() で得られるのが複数件のdocumentの集合なのでforEachで回して読み取らないといけないのが、前にも同じところで躓いた気がする。
JavaScript難しい…何度理解したと思っても少し書かない期間が空くと全部忘れてしまう…。
Links to work:
Today's Progress:
Firebase CLI を使用してルールをデプロイしたり、JavaScriptのコード内で firebase.auth().currentUser.uid でuidを取得してその値をCloud Firestore のDBに保存したりするやり方を試しました。
参考にしたドキュメント
Visual Studio Code に Firestore の .rules ファイル用の拡張機能があるのを発見。
Links to work:
Today's Progress:
Firebase Admin SDK Codelab の続きを進めていたのですが、 npm run dev でどうもNode.jsにうまくPathが通ってないような感じのエラーが発生する。
元々開発に手を付けていたバージョンでは firebase serve もうまく動いていたので、このエラーの解消の調査は今学習したいことから逸れていきそうだな…と思ったので、ドキュメントを読んで進める方向に方向転換しようと思います。なかなか迷走している…
Links to work:
Today's Progress:
こちらの動画 Security Rules! 🔑 | Get to Know Cloud Firestore #6 - YouTube の内容をおさらい。だいぶ理解できてきた。
Cloud Firestoreの firestore.rules には、認証情報によるルールだけでなく、リクエストのデータの内容・DBにあるデータの内容を参照してバリデーションのようなルールも設定できるとか。使い方少しずつイメージできてきた気がします。
Links to work:
Today's Progress:
下記の動画を見て、
Controlling Data Access Using Firebase Auth Custom Claims (Firecasts) - YouTube
Security Rules! 🔑 | Get to Know Cloud Firestore #6 - YouTube
こちらのCodelabに手を付け始めましたが、ちょっと行き詰まってる感。
CodelabのサンプルがNode.js のバージョンが古い物にしか対応していなかったので、nvmでバージョンを切り替えるのに挑戦。それはうまくいきました。
Links to work:
Today's Progress:
昨年作って公開したサイトのドメインの更新時期が迫ってきたのですが、対してアクセスもないので他で使っているドメインに統合しようと移転作業。
まるっと複製して、301リダイレクトを設定して、Googleアドレス変更申請。
明日からまたGoogle Assistantの作業に戻ろうと思います～。
Links to work:
Today's Progress:
最近一緒に勉強してくれてるリアル友人のコードでうまくいかないと聞いた所を調査。
自分の発想になかったことを調べるきっかけになってとても勉強になった…！
そして私CSS苦手なんだなと実感（笑）
クリックできない問題は z-index の指定で解決。
見せてもらったページで FontAwesome のアイコンに文字を重ねてかわいいボタンを作っていて、何これどうやってるの…！？と調べた。私にはその発想自体が無かった…！
参考：
Links to work:
Today's Progress:
下記を読んで、
ここら辺からコピペして、とりあえず動くことを確認。
ログイン・ログアウト機能が作れるのは分かった。GoogleでもEmailでもできた。
ではそれで取得したトークン？とかをどうやって権限管理に使ったらいいのか分からない…？
Links to work:
Today's Progress:
サンプルを動かしてみる？
FirebaseExtended/firechat: Real-time Chat powered by Firebase
と思ったけど、なんか違う感じがする…？firechatというもう出来上がってるプロダクト（Firebase authとかRealtime Databaseとかを使ってる）を導入する方法の説明みたいな気がする。
FirebaseUI というのが用意されていて、ログインUIはこれを使うのがよさそう。
https://github.com/firebase/firebaseui-web
YouTubeのFirecastもあった。
Using FirebaseUI Auth, on the Web - Firecasts - YouTube
ちょっとまだ情報を探して迷走中。
Links to work:
Today's Progress:
昨日 set メソッドでFirestoreにデータを登録できることを試した時に、指定したドキュメントにすでに他のフィールドが存在しても、 set で渡したフィールドのみの状態に上書きされてしまうことが分かったので、部分的に更新する方法を調査。
update メソッド、または set メソッドに { merge: true } を付けてあげることで実現できるようでした。
var setWithMerge = cityRef.set({
capital: true
}, { merge: true });明日試すのはここら辺かなあ。
ウェブサイトで Firebase Authentication を使ってみる | Firebase
Links to work:
Today's Progress:
Cloud Firestore のスタートガイドとそこにあった動画を参考に、Firebase Hosting に置いたウェブページ から Cloud Firestore のデータを操作できることを確認。
HTMLでシンプルな input フォームを設置して、JavaScriptにCloud Firestoreに docRef.set({ notice: "something" }) みたいなコードを書いて、Submitボタンのonclickで実行されるようにする感じ。とりあえずできました。
参考： Cloud Firestore を使ってみる | Firebase
またちょっと体内時計のずれる時期に入ってきて体力が辛い…。
Links to work:
Today's Progress:
無料キャンペーン中に…と思って1.5倍速ぐらいで一気に視聴（笑）
動画の講座って私の場合はあまり頭に入ってこなくて、かつ後で振り返りにくくて苦手なのですが、短時間でざっと概要を掴むという使い方には良いなと思いました。
Pluralsight今回初めて使ったのですが、YouTube等で公開されている無料の動画よりは音声や動画のクオリティも高い感じがして内容もまとまっていて、良かったと思います。
全文のTranscript（文字起こし）が見れるページがあるのも、後で内容を振り返って探すのに役立ちそう。
講座のジャンルも豊富で、Firebase関連の講座があったのも予想外だったので良い勉強になりました。
Links to work:
Today's Progress:
Pluralsightで学習した内容から、そもそもRailsアプリにしなくていいのでは…と気が付いてFirebaseHostingで作ってみることに。
セットアップ。 firebase deploy も firebase serve も上手くいきました。
Hostingの追加にあたって、既存のプロジェクトに対して firebase init して大丈夫なの…？と不安になりましたが、大丈夫でした。その辺ブログに残しておきました。
Links to work:
Today's Progress:
Pluralsightが今週末限定の無料キャンペーンをやっていたので、ちょっと手を出してみました。
ところが微妙に体調が悪くて思ったように進まず…。全体像を掴むくらいしかできませんでしたが、役には立ったと思います。明日もう少しやりたい。
Actioins on Googleで利用するデータを登録するサイトをRailsで作ろうと思っていて、そのためのRails Appを作り始めました。
WSL上でPostgreSQLが起動できなくなっていたのですが、結局 apt-get --purge remove postgresql\* とやって全部アンインストールして、再インストール。その後Railsアプリの database.yml にポート番号を指定してあげることで rails db:create が成功し、 rails s できるようになりました。
Links to work:
Today's Progress:
今日はちょっと内容軽め。でもフォローアップインテントについてドキュメントを読んだり触ってみたり、合言葉のキーワードが足りない時に訊き返す会話(Prompts)を追加したり（これはDialogflow ConsoleのUIから）
あまり複雑に作り込む前に、次はRailsアプリとFirestoreの接続方法を調べようかと思ってます。
Links to work:
Today's Progress:
できましたー！！！
db.collection(FirestoreNames.NOTICES) は取得できているのに db.collection(FirestoreNames.NOTICES).where(FirestoreNames.KEYWORD, '==', keyword) とするとデータが取得できない(Firebase FunctionsのログによるとMalformed responseというエラー)問題で悩んでいたのですが、Dialogflowのパラメータ名/Firestoreのフィールド名/index.js内の変数名の keyword を全て keyword0 に変更すると動くようになりました…原因はわかりません…
キーワード2つを組み合わせての検索もできました。
昨日セットアップしたローカルサーバー大活躍！確かにこれはいちいちFirebase Functionsにデプロイするよりずっと速いし手間がかからない。
Links to work:
Today's Progress:
この記事 を参考に、ローカルで Firebase Functions の代わりになるExpressサーバーを実行できるようにセットアップ。
JavaScriptの単純な文法にすら自信がない上にいろんなサービスを連携させて使わないといけないので、自分のコードが悪いのか何かの設定が上手くいってないのかの切り分けを繰り返すのに、少しコードを変える度に毎回 Firebase Functions にデプロイしないといけないのはかなり辛かったので。
セットアップはうまくいきました！DBにもアクセスできることを確認。これで開発がはかどりそう！
機能うまくいかなかったwhere句での絞り込みは同じように上手くいかず…明日からはこれを調査しようと思います。
Links to work:
Today's Progress:
昨日コードを読んでいたサンプルの真似をしながら、Actions on Googleコンソール、Dialogflow、Cloud Firestore等を設定。
Firestoreからデータの取得もできている。
ところが、なぜか where メソッドで検索した結果を取得しようとすると、急にレスポンスが返ってこなくなり、エラーになる。調査中。
Actions on Google、2年前くらいから構想だけはあって調べていて、日本語の音声でお気に入りの声があったので絶対この子で作ろう！と思っていたのですが、バージョンアップされて声が変わってしまっていて悲しい…（笑）
たしかに自然さはアップしてるんですが。好みの問題で…
Links to work: