差分

このページの2つのバージョン間の差分を表示します。

--- 13.vue.jsとfirebaseで認証つきボイスレコーダー:index.html [2019/01/10] – [新規Vue.jsアプリの作成と、前回の部分までのコードをコピペ] adash333
+++ 13.vue.jsとfirebaseで認証つきボイスレコーダー:index.html [2019/05/11] (現在) – [方針をたてる] adash333
@@ 行 34: / 行 34: @@
 {{:13.vue.jsとfirebaseで認証つきボイスレコーダー:pasted:20190110-095407.png}}
-デモサイト
+デモサイト1 (Firebase認証を用いる場合は、デプロイ先のアドレスを、FirebaseのAuthenticationで『認証済みドメイン』に登録する必要があります。)
+https://csb-zz65m3qyl4.netlify.com/
+デモサイト2
+https://zz65m3qyl4.codesandbox.io
 <html>
 <iframe src="https://codesandbox.io/embed/zz65m3qyl4" style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"></iframe>
@@ 行 215: / 行 220: @@
 src/components/Memo.vue
 {{:13.vue.jsとfirebaseで認証つきボイスレコーダー:pasted:20190109-213807.png}}
+（作成中、、、）
+===== 実行してみる =====
+{{:13.vue.jsとfirebaseで認証つきボイスレコーダー:pasted:20190110-100325.png}}
+{{:13.vue.jsとfirebaseで認証つきボイスレコーダー:pasted:20190110-100421.png}}
+{{:13.vue.jsとfirebaseで認証つきボイスレコーダー:pasted:20190110-100507.png}}
+うまくいっているようです。必ずしも音声入力しなくても、普通のメモとしても利用できます。
 ===== ソースコード =====
@@ 行 225: / 行 241: @@
 デモサイト
+https://zz65m3qyl4.codesandbox.io
 <html>
 <iframe src="https://codesandbox.io/embed/zz65m3qyl4" style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"></iframe>
@@ 行 232: / 行 252: @@
 ===== 気になること =====
-前回の<wrap hi>[[12.vue.jsとwebspeechapiで音声認識アプリ:|12.vue.jsとwebspeechapiで音声認識アプリ:]]</wrap>までのコードをコピペしようと思ったのですが、よくわからず、結局、データを1個追加したり削除するたびに、ローカルにnotesデータを更新して、そのnotesデータ全てを、Firestoreにアップロードしたり、ダウンロードしたりするコードになってしまいました。テキストなのでまあよいかもしれませんが、データ通信量が莫大になってしまうのが気になりますが、解決方法がわかりません。
+前回の<wrap hi>[[12.vue.jsとwebspeechapiで音声認識アプリ:|12.vue.jsとwebspeechapiで音声認識アプリ:]]</wrap>までのコードをコピペしようと思ったのですが、やり方がわかりませんでした。結局、データを1個追加したり削除するたびに、ローカルのnotesデータ(オブジェクト、連想配列)を更新して、そのnotesデータ全てを、Firestoreにアップロードしたり、ダウンロードしたりするコードになってしまいました。テキストなのでまあよいかもしれませんが、データ通信量が莫大になってしまうのが気になりますが、解決方法がわかりません。
 ===== 今回写経した本 =====
 Vue.js初めての方に非常にお勧めです。読みながら手を動かしてアプリが動くことを実感できて楽しいです。