【Firebase】リアルタイム更新されるチャットアプリを作成してFirebaseを学ぶ(Aauthログインも)

投稿日:

プログラミング初心者の勉強ブログ #118

Firebaseを使って簡易的なチャットアプリを作成したのでまとめる。リアルタイム更新はもちろん、DBもストレージもあって、APIも少ない手間で実装できるしFirebaseすげーって感じでした。

 

目次

 

Firebase

firebase

https://firebase.google.com/

 

G'sでそのうち習うっぽいが、早めにやっておこうと思いリアルタイム更新されるチャットアプリ的な物を作ってみることにした。

 

Firebaseで作成したもの

stockidea

stock idea

とりあえず動くが、何箇所か意図せず起こる挙動がまだあるので、下に載せているコードは参考程度。

 

 

firebase

Firebaseを使うと、JSでリアルタイムな画面表示を更新できるようなものを作成できる。Oauthによるログインも少ないコードで実装が可能。ちょっとしたアプリなら無料枠内でリリースとかできるんじゃないかって思う。機能多くてまだあまりよくわかってないが、Railsよりは少なくとも実装が簡単だった。小規模なものであればRails使わないでFirebase使った方が良さげなのかもしれん。Oauth実装とかもだいぶ楽。

 

Firebase Notificationsをやめた4つの理由 - Qiita

それでもFirebaseを使うべき5つのメリット - Qiita

Qiitaをいろいろと読んでみたもののあまり理解することができなかった。

 

Firebaseでバックエンドエンジニア不在のアプリ開発 クックパッドが体感した、メリットと課題 - エンジニアHub|若手Webエンジニアのキャリアを考える!

この記事が一番参考になった。というより面白かった。

 

コード

結構いろいろと調べた。Firebaseの仕様が高頻度で変わっているからなのかもしれないが、調べても過去の情報とかが多く、今これで書いても反映されないわ、って何回もなった。

Firebase のガイド | Firebase

公式のガイドが一番確実な情報を載っけてくれているが、とても探しづらかった。YouTube APIとかのリファレンスの方がよっぽど探しやすかった気がする。先にも書いたが、とりあえず動くが何箇所か意図していない挙動がある。コンソールで「firebase.INTERNAL.registerAppHook is not a function」と言う、なんかよくわからないエラーもまだ出てくる。

 

main.js

 

index.html

 

まとめ

JSだけで実装できるのが楽しい。バックエンドやった感覚は少ない。データ構造をもう少し複雑にして、また挑戦してみたい。

以上ありがとうございました。

-プログラミング学習
-, , ,

Copyright© s u p ? , 2019 All Rights Reserved.