未分類

デプロイ

投稿日:

firebaseからデータを取り出す

firebaseを使ってそこの保存しているデータを受け取り、MessageListコンポーネントで表示させるように実装しました。firebaseから受け取るデータの形を取り出しやすいように変更させる必要があり、まず最初にorderByKeyメソッドでfirebaseから送られてくるキーがタイムスタンプの昇順に並べるようにし、limitToLastメソッドで受け取るデータの数を指定し、on(‘value’, (snapshot) => {}でonメソッドの第二引数を関数で指定し、引数のsnapshotにvalメソッドを指定してfirebaseに保存されているデータの全てを受け取り、定数messagesに代入します。その次にObject.entryies(messages)で受け取ったデータを配列の形にします。そのデータをmapメソッドで一つ一つ取り出します。そのメッセージ一つ一つをsetMessageでstateに保存し、そのstateに保存されているメッセージを画面に表示させます。

デプロイ

firebaseのサイトのプロジェクトと紐付けをしてデプロイをしました。まず最初にアプリケーションをbuildしてから紐付けをします。タイトルにしましたが特に書くことはないのでやめます。

環境変数

アプリケーションをgitに上げて管理するのですが、firebaseのapiキーやデータが随時変更されるものはgitにコミットしないほうがいいのでgitignoreファイルに指定してcommitしないようにすることを学びました。特に知られてはまずいapiキーは環境変数に代入して使用しました。環境変数とはどこのファイルからでも参照することができる変数でその変数が格納されているファイルをgitに上げないようにすれば問題はありません。

まとめ

なんとかチャットアプリを完成させることができたので明日からはカレンダーの作成に入りたいと思います。コンポーネントの仕組みやデータの受け渡し方は理解できたので簡単なアプリケーションからどんどん作れるようになっていきたいです。

-未分類

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

php3

 プロゲートのphpが終わったのでここまででわかったことを書きます。phpはwebアプリケーションを作るプログラミング言語です。このワードプレスもphpで書かれています。phpファイルではhtmlと一 …

no image

スマートシティ

 今日は古坂大魔王とニュースピックスの佐々木さんがやっている番組の動画をみました。いろんな専門家を集めて決められた話題について議論をしていくという番組なのですが、今日はスマートシティについてやっていま …

no image

今週終わり

今週から会社が始まりあっという間に一週間画過ぎてしまいました。詰め込み過ぎて入社から1年くらい経過した気がするのですがまだ一週間ということなので驚きました。頑張りたいと思います。 git vsコードか …

no image

typescript

typescriptはjavascriptの変数で予期せぬエラーを起こさないために型安全でコードを書くプログラミング言語です。typescriptのコードをjavascriptのコードに変換して使うの …

no image

面接練習

 今日は本をほとんど見ていません。朝から面談が入り、昼からも面談がありました。夕方に一社面接を受けたのですが、微妙でした。でも昼に面談した方が面白かったので書きます。その会社さんはベンチャー企業なので …